两个多选框(select)之间值的左右上下移动
来源：互联网 发布：网络暴力数据分析2017 编辑：程序博客网 时间：2024/05/22 13:16
两个多选框(select)之间值的左右上下移动
两个多选框（select）之间值的左右上下移动的代码请参考：
<html>
<head>
<title>MultiSelects </title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
<!--
$（function（）{
$（"#s1 option:first,#s2 option:first"）。attr（"selected",true）；
$（"#s1"）。dblclick（function（）{
var alloptions = $（"#s1 option"）；
var so = $（"#s1 option:selected"）；
if（so === null || so == "undefined"）{
return;
}
try{
var a = （so.get（so.length-1）。index == alloptions.length-1）？ so.prev（）。attr（"selected",true）：so.next（）。attr（"selected",true）；
}catch（e）{
return;
}
$（"#s2"）。append（so）；
}）；
$（"#s2"）。dblclick（function（）{
var alloptions = $（"#s2 option"）；
var so = $（"#s2 option:selected"）；
if（so === null || so == "undefined"）{
return;
}
try{
var a = （so.get（so.length-1）。index == alloptions.length-1）？ so.prev（）。attr（"selected",true）：so.next（）。attr（"selected",true）；
}catch（e）{
return;
}
$（"#s1"）。append（so）；
}）；
$（"#add"）。click（function（）{
var alloptions = $（"#s1 option"）；
var so = $（"#s1 option:selected"）；
var a = （so.get（so.length-1）。index == alloptions.length-1）？ so.prev（）。attr（"selected",true）：so.next（）。attr（"selected",true）；
$（"#s2"）。append（so）；
}）；
$（"#remove"）。click（function（）{
var alloptions = $（"#s2 option"）；
var so = $（"#s2 option:selected"）；
var a = （so.get（so.length-1）。index == alloptions.length-1）？ so.prev（）。attr（"selected",true）：so.next（）。attr（"selected",true）；
$（"#s1"）。append（so）；
}）；
$（"#addall"）。click（function（）{
$（"#s2"）。append（$（"#s1 option"）。attr（"selected",true））；
}）；
$（"#removeall"）。click（function（）{
$（"#s1"）。append（$（"#s2 option"）。attr（"selected",true））；
}）；
$（"#s1up"）。click（function（）{
var so = $（"#s1 option:selected"）；
if（so.get（0）。index!==0）{
so.each（function（）{
$（this）。prev（）。before（$（this））；
}）；
}
}）；
$（"#s1down"）。click（function（）{
var alloptions = $（"#s1 option"）；
var so = $（"#s1 option:selected"）；
if（so.get（so.length-1）。index!=alloptions.length-1）{
for（i=so.length-1;i>=0;i=1-1）
{
var item = $（so.get（i））；
item.insertAfter（item.next（））；
}
}
}）；
$（"#s2up"）。click（function（）{
var so = $（"#s2 option:selected"）；
if（so.get（0）。index!==0）{
so.each（function（）{
$（this）。prev（）。before（$（this））；
}）；
}
}）；
$（"#s2down"）。click（function（）{
var alloptions = $（"#s2 option"）；
var so = $（"#s2 option:selected"）；
if（so.get（so.length-1）。index!=alloptions.length-1）{
for（i=so.length-1;i>=0;i--）
{
var item = $（so.get（i））；
item.insertAfter（item.next（））；
}
}
}）；
}）；
-->
</script>
</head>
<body>
<table width="288" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="29">
<input type="button" name="s1up" id="s1up" value="up" /><br />
<input type="button" name="s1down" id="s1down" value="down"/>
</td>
<td width="100">
<select name="s1" size="10" multiple="multiple" id="s1" style=" width:100px;">
<option value="opt01">option01</option>
<option value="opt02">option02</option>
<option value="opt03">option03</option>
<option value="opt04">option04</option>
<option value="opt05">option05</option>
<option value="opt06">option06</option>
<option value="opt07">option07</option>
<option value="opt08">option08</option>
<option value="opt09">option09</option>
<option value="opt10">option10</option>
</select>
</td>
<td width="37" align="center"><input type="button" name="addall" id="addall" value=">|" /><br /><input type="button" name="add" id="add" value=">>" /><br /><input type="button" name="remove" id="remove" value="<<" /><br /><input type="button" name="removeall" id="removeall" value="|<" /></td>
<td width="100"><select name="s2" size="10" multiple="multiple" id="s2" style=" width:100px;">
</select></td>
<td width="119">
<input type="button" name="s2up" id="s2up" value="up" /><br />
<input type="button" name="s2down" id="s2down" value="down" /></td>
</tr>
</table>
</body>
</html>
博洋教育(http://www.softfz.com/)教师简介：陈丽萍，高级java讲师，7年教学经验。
J2EE资深开发工程师，6年软件开发经验。主要从事JAVA EE 平台技术的应用开发, 对JAVA EE体系构架理解透彻，基础扎实，掌握面向对象理念。对主流框架如Struts、Spring、Hibernate以及AJAX等技术具备成熟的开发经验。
两个多选框（select）之间值的左右上下移动的代码请参考：
<html>
<head>
<title>MultiSelects </title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
<!--
$（function（）{
$（"#s1 option:first,#s2 option:first"）。attr（"selected",true）；
$（"#s1"）。dblclick（function（）{
var alloptions = $（"#s1 option"）；
var so = $（"#s1 option:selected"）；
if（so === null || so == "undefined"）{
return;
}
try{
var a = （so.get（so.length-1）。index == alloptions.length-1）？ so.prev（）。attr（"selected",true）：so.next（）。attr（"selected",true）；
}catch（e）{
return;
}
$（"#s2"）。append（so）；
}）；
$（"#s2"）。dblclick（function（）{
var alloptions = $（"#s2 option"）；
var so = $（"#s2 option:selected"）；
if（so === null || so == "undefined"）{
return;
}
try{
var a = （so.get（so.length-1）。index == alloptions.length-1）？ so.prev（）。attr（"selected",true）：so.next（）。attr（"selected",true）；
}catch（e）{
return;
}
$（"#s1"）。append（so）；
}）；
$（"#add"）。click（function（）{
var alloptions = $（"#s1 option"）；
var so = $（"#s1 option:selected"）；
var a = （so.get（so.length-1）。index == alloptions.length-1）？ so.prev（）。attr（"selected",true）：so.next（）。attr（"selected",true）；
$（"#s2"）。append（so）；
}）；
$（"#remove"）。click（function（）{
var alloptions = $（"#s2 option"）；
var so = $（"#s2 option:selected"）；
var a = （so.get（so.length-1）。index == alloptions.length-1）？ so.prev（）。attr（"selected",true）：so.next（）。attr（"selected",true）；
$（"#s1"）。append（so）；
}）；
$（"#addall"）。click（function（）{
$（"#s2"）。append（$（"#s1 option"）。attr（"selected",true））；
}）；
$（"#removeall"）。click（function（）{
$（"#s1"）。append（$（"#s2 option"）。attr（"selected",true））；
}）；
$（"#s1up"）。click（function（）{
var so = $（"#s1 option:selected"）；
if（so.get（0）。index!==0）{
so.each（function（）{
$（this）。prev（）。before（$（this））；
}）；
}
}）；
$（"#s1down"）。click（function（）{
var alloptions = $（"#s1 option"）；
var so = $（"#s1 option:selected"）；
if（so.get（so.length-1）。index!=alloptions.length-1）{
for（i=so.length-1;i>=0;i=1-1）
{
var item = $（so.get（i））；
item.insertAfter（item.next（））；
}
}
}）；
$（"#s2up"）。click（function（）{
var so = $（"#s2 option:selected"）；
if（so.get（0）。index!==0）{
so.each（function（）{
$（this）。prev（）。before（$（this））；
}）；
}
}）；
$（"#s2down"）。click（function（）{
var alloptions = $（"#s2 option"）；
var so = $（"#s2 option:selected"）；
if（so.get（so.length-1）。index!=alloptions.length-1）{
for（i=so.length-1;i>=0;i--）
{
var item = $（so.get（i））；
item.insertAfter（item.next（））；
}
}
}）；
}）；
-->
</script>
</head>
<body>
<table width="288" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="29">
<input type="button" name="s1up" id="s1up" value="up" /><br />
<input type="button" name="s1down" id="s1down" value="down"/>
</td>
<td width="100">
<select name="s1" size="10" multiple="multiple" id="s1" style=" width:100px;">
<option value="opt01">option01</option>
<option value="opt02">option02</option>
<option value="opt03">option03</option>
<option value="opt04">option04</option>
<option value="opt05">option05</option>
<option value="opt06">option06</option>
<option value="opt07">option07</option>
<option value="opt08">option08</option>
<option value="opt09">option09</option>
<option value="opt10">option10</option>
</select>
</td>
<td width="37" align="center"><input type="button" name="addall" id="addall" value=">|" /><br /><input type="button" name="add" id="add" value=">>" /><br /><input type="button" name="remove" id="remove" value="<<" /><br /><input type="button" name="removeall" id="removeall" value="|<" /></td>
<td width="100"><select name="s2" size="10" multiple="multiple" id="s2" style=" width:100px;">
</select></td>
<td width="119">
<input type="button" name="s2up" id="s2up" value="up" /><br />
<input type="button" name="s2down" id="s2down" value="down" /></td>
</tr>
</table>
</body>
</html>
博洋教育(http://www.softfz.com/)教师简介：陈丽萍，高级java讲师，7年教学经验。
J2EE资深开发工程师，6年软件开发经验。主要从事JAVA EE 平台技术的应用开发, 对JAVA EE体系构架理解透彻，基础扎实，掌握面向对象理念。对主流框架如Struts、Spring、Hibernate以及AJAX等技术具备成熟的开发经验。
0 0
- 两个多选框(select)之间值的左右上下移动
- 两个多选框(select)之间值的左右上下移动
- 两个多选框(select)之间值的左右上下移动
- js 两个select之间的左右移动
- SELECT 选择框上下移动 左右移动
- 有关select左右移动、上下移动、双击移动效果代码
- 有关select左右移动、上下移动、双击移动效果代码
- jquery实现select多选框的左右移动
- Jquery实现SELECT多选并且左右上下移动
- 列表框的左右上下移动
- 【js】左右上下移动
- 两个UIViewController之间的翻转可以用动画效果翻转(上下，左右)－－跨界面之间的视图切换
- js: 实现Select的option上下移动
- js: 实现Select的option上下移动
- jquery实现左右上下移动
- Listview中行之间的上下移动
- select 左右移动
- vs2005制做左右上下移动的Listbox ( asp.net , C#)
- Docker-github安装记录
- 对App的Application的测试
- Android使用tcpdump和wireshark抓取并分析网络数据包
- Linux 使用 cp 命令强制覆盖功能
- 适应新手---线上生产环境的PHP源码安装（php-httpd）
- 两个多选框(select)之间值的左右上下移动
- 在CorelDRAW中导入位图的方法
- liferay学习1--下载并运行
- zabbix常见报错问题处理
- oracle基础知识2----pl/sql基础(基本语法、光标、例外、应用)
- Java ConcurrentModificationException异常原因和解决方法
- 前馈 反馈神经网络
- 例题11-2 UVA - 1395 Slim Span 苗条的生成树（Kruscal最小生成树）
- 比较器报错 comparison methed violates its general contract
