手机
当前位置:查字典教程网 >编程开发 >asp.net教程 >javascript实现listbox左右移动实现代码
javascript实现listbox左右移动实现代码
摘要:1。html部分:复制代码代码如下:所有地区已选地区2。javascript部分:复制代码代码如下:functionadd(sourlist...

1。 html部分:

复制代码 代码如下:

<table cellSpacing="0" borderColorDark="#ffffff" cellPadding="3" width="460"

align="left" borderColorLight="#000000" border="1">

<tr bgColor="#cccccc">

<td align="center" width="180"><b>所有地区</b> <asp:HiddenField ID="HidDistrictId" runat="server" /> </td>

<td align="center" width="60"></td>

<td align="center" width="180"><b>已选地区</b></td>

</tr>

<tr >

<td bgcolor="#cccccc" >

<asp:listbox id="listNewEmp" runat="server" Height="200px" Width="180px" SelectionMode="Single"></asp:listbox></td>

<td valign="top" align="center" bgcolor="#cccccc">

<asp:Panel ID="Panel1" runat="server" Height="180px" >

<br> <br>

<%--<asp:Button Text="选择→" ID="btnReceSendToRight" runat="server"/>--%>

<INPUT type="button" value="选择→" onclick = "add('listNewEmp','listright','HidDistrictId')" Text="选择→">

<br>

<br>

<INPUT type="button" value="←删除" onclick = "move('listright')" Text="←删除">

<%--<asp:Button Text="←删除" ID="btnReceSendToLeft" runat="server"/>--%>

</asp:Panel>

</td>

<td bgcolor="#cccccc">

<asp:listbox id="listright" runat="server" Height="200px" Width="180px" SelectionMode="Multiple"></asp:listbox>

</td>

</tr>

</table>

2。 javascript 部分:

复制代码 代码如下:

<script language="Javascript">

function add(sourlist, deslist,hidId)

{ //添加

var objres = document.getElementById(sourlist);

var objsel = document.getElementById(deslist);

var customOptions;

for(var i = objres.options.length - 1 ;i >= 0;i--)

{

if(objres.options[i].selected)

{

customOptions = document.createElement("OPTION");

customOptions.text = objres.options[i].text;

customOptions.value = objres.options[i].value;

if (objsel.options.length>0)

objsel.remove(objsel.options.length - 1);

document.getElementById(hidId).value = customOptions.value;

objsel.add(customOptions,0);

}

}

return false;

}

function move(deslist) { //删除

var objres = document.getElementById(deslist);

objres.remove(objres.options.length - 1);

}

</script>

3.。cs部分

存储是存 HidDistrictId.Value里的值,具体部分,用的时候再调节

4。 效果图:

javascript实现listbox左右移动实现代码1

【javascript实现listbox左右移动实现代码】相关文章:

在asp.net中实现datagrid checkbox 全选的方法

asp图片防盗链的代码

用asp.net c# HttpWebRequest获取网页源代码

ASP.NET Ajax级联DropDownList实现代码

javascript操作ASP.NET服务器控件

asp.net 购物车实现详细代码

asp.net Execl的添加,更新操作实现代码

C#默认以管理员身份运行程序实现代码

asp.net 生成曲线图实现代码

用javascript css实现GridView行背景色交替、鼠标划过行变色,点击行变色选中

精品推荐
分类导航