页面代码:

 <table border="0" cellpadding="0" cellspacing="0" style="width: 32%">
<tr>
<td>
<asp:ListBox ID="lbLeft" runat="server" Width="150px" Height="200" DataTextField="Name" DataValueField="ID" SelectionMode="Multiple"></asp:ListBox>
</td>
<td><input id="btnAll" onclick="SelectAll()" type="button" class="C_input02" value=">>" />
<br /><br />
<input id="btnAdd" onclick="SelectOne()" type="button" class="C_input02" value=">" /><br /><br />
<input id="btnDel" onclick="DelOne()" type="button" class="C_input02" value="<" /><br /><br />
<input id="btnDAll" onclick="DelAll()" type="button" class="C_input02" value="<<" />
</td>
<td>
<asp:ListBox ID="lbRight" runat="server" Width="150px" SelectionMode="Multiple" Height="200"></asp:ListBox>
</td>
</tr>
</table>
<input id="txtProvider" runat="server" style="display:none" />

javascript代码:

 <script type="text/javascript">
function SelectAll()
{
var lst1=window.document.getElementByIdx_x_x_x("<%=lbLeft.ClientID %>");
var length = lst1.options.length;
var string = window.document.getElementByIdx_x_x_x("<%=txtProvider.ClientID %>")
for(var i=0;i<length;i++)
{
var v = lst1.options[i].value;
var t = lst1.options[i].text;
var lst2=window.document.getElementByIdx_x_x_x("<%=lbRight.ClientID %>");
lst2.options[i] = new Option(t,v,true,true);
string.value+=v+",";
}
} function DelAll()
{
var lst2=window.document.getElementByIdx_x_x_x("<%=lbRight.ClientID %>");
var string = window.document.getElementByIdx_x_x_x("<%=txtProvider.ClientID %>")
var length = lst2.options.length;
for(var i=length;i>0;i--)
{
lst2.options[i-1].parentNode.removeChild(lst2.options[i-1]);
}
string.value = "";
} function SelectOne()
{
var string = window.document.getElementByIdx_x_x_x("<%=txtProvider.ClientID %>")
var lst1=window.document.getElementByIdx_x_x_x("<%=lbLeft.ClientID %>");
var lst2=window.document.getElementByIdx_x_x_x("<%=lbRight.ClientID %>");
var lstindex=lst1.selectedIndex;
var length = lst2.options.length;
var isExists = false;
if(lstindex<0)
return;
else if(length != null)
{
for(var i=0;i < length; i++)
{
if(lst2.options[i].text == lst1[lstindex].text&&lst2.options[i].value == lst1[lstindex].value)
{
isExists = true;
}
}
}
else
{
return;
}
if (isExists == false)
{
var v = lst1.options[lstindex].value;
var t = lst1.options[lstindex].text;
lst2.options[lst2.options.length] = new Option(t,v,true,true);
string.value+=v+",";
}
else
{
alert("所选条目数据已经存在");
return false;
}
} function DelOne()
{
var lst2=window.document.getElementByIdx_x_x_x("<%=lbRight.ClientID %>");
var string = window.document.getElementByIdx_x_x_x("<%=txtProvider.ClientID %>")
var lstindex=lst2.selectedIndex;
if(lstindex>=0)
{
var v = lst2.options[lstindex].value+";";
var va = lst2.options[lstindex].value+",";
lst2.options[lstindex].parentNode.removeChild(lst2.options[lstindex]);
string.value = string.value.replace(va,"");
}
}
</script>

兼容IE、火狐

两个listbox 无刷新互动的更多相关文章

  1. ajax实现无刷新两级联动DropDownList

    ajax实现的无刷新三级联动 http://zhangyu028.cnblogs.com/articles/310568.html 本文来自小山blog:http://singlepine.cnblo ...

  2. ASP_NET实现界面无刷新的DropdownList两级联动效果

    所谓DropdownList联动,也就是在选一个DropdownList的时候使另外一个DropdownList的内容更新(如选省份时显示所属城市),按常规的方法那就是在第一个DropdownList ...

  3. JQuery实现无刷新下拉加载图片

          最近做的一个项目需要做页面无刷新下拉加载图片,调研了一番,大多都采用检测滚动条达到底部,然后利用ajax加载下一页数据对页面数据进行添加,根据这一逻辑,自己写了一个,具体代码如下: JQu ...

  4. mvc file控件无刷新异步上传操作

    前言 上传文件应该是很常见必不可少的一个操作,网上也有很多提供的上传控件.今天遇到一个问题:input控件file无法进行异步无刷新上传.真真的感到别扭.所以就尝试这去处理了一下.主要分三个部分:上传 ...

  5. 利用history实现无刷新跳转界面

    看标题是不是感觉很拽的样子,其实没什么啦,也就是时下常说的单页面应用.这种web形式在如今的移动端十分流行,毕竟在移动端频繁得去刷新界面不是很友好,而且还费流量.今天我们要做一个小的app(移动端), ...

  6. jQuery AJAX 网页无刷新上传示例

    新年礼,提供简单.易套用的 jQuery AJAX 上传示例及代码下载.后台对文件的上传及检查,以 C#/.NET Handler 处理 (可视需要改写成 Java 或 PHP). 有时做一个网站项目 ...

  7. ajax 无刷新上传

    最近要做微信的图文上传,因为一个图文了表中可以有多个图文,所有按钮需要随时添加,所以做了一种无刷新上传的方法. 首先我们要在html页面中写上这样的几段代码 javascript: $(functio ...

  8. 使用AjaxPro实现无刷新更新数据

    需求 在一个页面动态无刷新的更新后台得到的数据.要想无刷新的更新数据,需要使用Javascript能够获取后台返回的数据,然后通过第三方Javascript库(JQuery等)动态更新web页面DOM ...

  9. asp.net Ajax刷新和无刷新的区别

    无刷新按钮btnShua 刷新按钮btnWu label控件和calendar控件在updatePanel中显示 两个button按钮在div中 <%@ Page Language=" ...

随机推荐

  1. C#中new和override的区别

    override是指“覆盖”,是指子类覆盖了父类的方法.子类的对象无法再访问父类中的该方法.(签名必须相同) new是指“隐藏”,是指子类隐藏了父类的方法,当然,通过一定的转换,可以在子类的对象中访问 ...

  2. Android AsyncTask学习

    Android程序有UI进程和后台进程,在执行一些耗时的操作时,如果在UI进程中,很可能出现假死的情况,用户体验会受到影响,因此,那些耗时进程往往就放在了后台进程中,用户体验能更好一些.网络情况不稳定 ...

  3. String功能测试

    package foxe; import java.io.IOException;import java.util.StringTokenizer; public class MainClass { ...

  4. 正则表达式,Regex类

    C#regex是正则表达式类用于string的处理,查找匹配的字符串.1,先看一个例子Regex regex=new Regex(@”OK“)://我们要在目标字符串中找到"OK" ...

  5. Hadoop高可用平台搭建

    文章概览: 1.机器规划和预配置 2.软件安装 3.集群文件配置 4.启动集群 5.HA验证 6.注意事项 7.小结   机器规划和预配置 主机/进程 NN DN RM NM ZK(QP) ZKFC ...

  6. MFC软件工程架构模型-模式窗口-非模式窗口

    1. SDI单文档界面: MDI多文档界面.有多个"关闭-最大化-最小化"等这样的窗口嵌套 基于对话框的软件模型 2.模式对话框和非模式对话框 模式对话框:使用DoMoel(),弹 ...

  7. Mac添加或修改环境变量

    方式1. 终端添加或修改 命令:pico, vim等 方式:pico .bash_profile 方式2. 文本方式添加或修改 1)打开 touch ~/.bash_profile open -t ~ ...

  8. android 开发中判断网络是否连接的代码

    在android的开发中,尤其是与访问网络有关的开发,都要判断一下手机是否连接上了网络,下面是一个判断是否连接网络的嗲吗片段: package cn.com.karl.util; import com ...

  9. 图文-水平垂直居中兼容ie6+

    图文-水平垂直居中兼容ie6+ 具体代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8&q ...

  10. Lambda表达式 之 C#

    Lambda表达式 "Lambda表达式"是一个匿名函数,是一种高效的类似于函数式编程的表达式,Lambda简化了开发中需要编写的代码量.它可以包含表达式和语句,并且可用于创建委托 ...