码迷,mamicode.com
首页 > 移动开发 > 详细

列表左右移动 2017-03-23

时间:2017-03-23 14:39:43      阅读:181      评论:0      收藏:0      [点我收藏+]

标签:索引   左右移动   cal   分享   左移   赋值   蓝色   技术   end   

技术分享

<body>

<select id="s1" size="10" >

<option>红色</option>

<option>绿色</option>

<option>蓝色</option>

<option>黑色</option>

<option>白色</option>

</select>

 

<select id="s2" size="10" >

<option>苹果</option>

<option>香蕉</option>

<option>桃子</option>

<option></option>

<option>橙子</option>

</select><br />

<input type="button" id="t1" value="右移" />

 

        <input type="button" id="t2" value="左移" />      

         <script>

document.getElementById("t1").onclick=function(){    -----右移

var op=document.getElementById("s1").selectedOptions;---------将选中的数据赋值给op

document.getElementById("s2").appendChild(op[0]);  ------表示选中的数据中索引值为0

document.getElementById("s1").removeChild(op[0]);

}

document.getElementById("t2").onclick=function(){   ----左移

var op=document.getElementById("s2").selectedOptions;

document.getElementById("s1").appendChild(op[0]);

document.getElementById("s2").removeChild(op[0]);

}

</script>

</body>

列表左右移动 2017-03-23

标签:索引   左右移动   cal   分享   左移   赋值   蓝色   技术   end   

原文地址:http://www.cnblogs.com/chenguanai/p/6604597.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!