页面代码:

 <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. vc中调用Com组件的方法详解

    vc中调用Com组件的方法详解 转载自:网络,来源未知,如有知晓者请告知我.需求:1.创建myCom.dll,该COM只有一个组件,两个接口:   IGetRes--方法Hello(),   IGet ...

  2. ssh maven 搭建

    数据库建表脚本不带,是很简单的一个表,把数据库环境搭建起来即可. 1.项目结构(Eclipse) 2.pom.xml <project xmlns="http://maven.apac ...

  3. ZJOI 最小割 CQOI 不同的最小割 (最小割分治)

    题目1 ZJOI 最小割 题目大意: 求一个无向带权图两点间的最小割,询问小于等于c的点对有多少. 算法讨论: 最小割 分治 代码: #include <cstdlib> #include ...

  4. poj2251 三维简单BFS

    D - (热身)简单宽搜回顾 Time Limit:1000MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I64u Subm ...

  5. Ajax中send方法参数的使用

    一般情况下,使用Ajax提交的参数多是些简单的字符串,可以直接使用GET方法将要提交的参数写到open方法的url参数中,此时send方法的参数为null. 例如 : var url = " ...

  6. CC3的多列属性Multi-column

    CC3的多列属性Multi-column 一直都很想了解这个属性,总是忘了.今天可以研究一下,回想起想了解它的原因,大概是觉得它很容易分开几列.可能会有很多好处和方便. 0 16-09-17 1 16 ...

  7. github多人协作

    1.字符串处理(编码原理) git clone git@github.com:lookphp/LaravelCms.git git add . git commit -m "修改的内容-需要 ...

  8. mongodb的连接问题,绑定IP惹的祸

    刚刚安装好了 mongodb .对着 mongodb in action上的例子敲了下面的代码: public class TestDBConnect { @Test public void test ...

  9. ASP.NET学习笔记——ASP.NET应用程序

    0 剖析ASP.NET应用程序 用户运行ASP.NET应用程序,不是直接运行,而是使用浏览器(比如IE)通过HTTP请求一个特定的URL(如http://www.mysite.com/mypage.a ...

  10. Virtual Box 工具栏(菜单栏)消失的解决方法

    异常处理汇总-开发工具  http://www.cnblogs.com/dunitian/p/4522988.html 现在Virtual Box非常牛逼(不排除Oracle又准备像Java SE那样 ...