jquery实现挑选选择框内容左右移动代码分享

本文实例讲述了挑选选择框内容左右移动添加删除。分享给大家供大家参考。具体如下：选择选择框内容左右移动，简单实用，选中选项内容，点击移动按钮可进行内容左右移动，运行效果图：

具体代码如下

！DOCTYPE html html head meta charset=' utf-8 '/title index/title/head body div select id=' left selector ' multiple=' multiple ' name=' SmsListOnLeft ' style=' height :100 px；width :50 px ' option value=' 0 ' 0/option value=' 1 ' 1/option value=' 2 ' 2/option value=' 3 ' 3/option option value=' 4 ' 4/option value=' 5 ' 5/option/select span style=' top 3360 30px；位置：固定；'input type=' button ' value=' id=' btnLeft '/input type=' button ' value=' id=' BTN右'/span select id='右选择器' multiple=' multiple ' name=' SmsListOnRight ' style=' height :100 px；宽度：50 px左边距-:80像素选项值=' 6 ' A/选项值=' 7 ' B/选项值=' 8 ' C/选项值=' 9 ' D/选项值=' 10 ' E/选项/select /div br输入类型=' button ' onclick=' selectAll()' id=' btnseselectall ' value=' selectAll '/script src=' http 3360 js/jquery-2。1 .4 .js '/script script $(“# 1”)单击(函数(){ //数据选择权选中的数据集合赋值给变量vSelect var vSelect=$(' #左选择器选项：选中')；//克隆数据添加到右选择器中vSelect.clone().appendo(' #右选择器')；//同时移除左选择器中的选项vselect。移除()；});//右移$(' # btnlft ').单击(function(){ var vSelect=$(' #右选择器选项：选中')；vSelect.clone().appendo(' #左选择器')；vselect。移除()；});函数selectAll(){ var lst 1=window。文件。getelementbyid('右选择器')；可变长度=lst 1。选项。长度；for(var I=0；一、长度；i ) { var v=lst1.options[i].价值；//选项内的var t=lst1.options[i]的值。文本；//显示的文本警报(v ' : ' t)；} }/脚本/正文/html希望本文对大家学习爪哇岛描述语言程序设计有所帮助。