當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JS 实现列表移动(JQuery实现)
生活随笔
收集整理的這篇文章主要介紹了
JS 实现列表移动(JQuery实现)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
JS 實現列表移動
- 學習內容:
- 需求
- 總結:
學習內容:
需求
用 JS 實現列表移動
實現代碼
<html> <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>列表移動</title><script type="text/javascript" src="/static/jQuery-1.11/jquery-1.11.3.min.js"></script><script>function moveAll(srcId, targetId) {// ('#' + targetId)拼接字符串$('#' + targetId).append($("#" + srcId + " > option"));}function moveSelected(srcId, targetId) {// ('#' + targetId)拼接字符串$('#' + targetId).append($('#' + srcId + ' > option:selected'));}</script> </head> <body> <table border="1"><tr><td><select id="select1" style="width:100px;height:200px" size="10"multiple="multiple"><option value="選項1">選項1</option><option value="選項2">選項2</option><option value="選項3">選項3</option><option value="選項4">選項4</option><option value="選項5">選項5</option><option value="選項6">選項6</option><option value="選項7">選項7</option><option value="選項8">選項8</option><option value="選項9">選項9</option></select></td><td align="center"><input type="button" onclick="moveSelected('select1','select2')"value="-->"/><br/><input type="button" onclick="moveAll('select1','select2')"value="==>"/><br/><input type="button" onclick="moveSelected('select2','select1')"value="<--"/><br/><input type="button" onclick="moveAll('select2','select1')"value="<=="/></td><td><select id="select2" style="width:100px;height:200px" size="10"multiple="multiple"></select></td></tr> </table> </body> </html>總結:
以上就是用 JS 實現列表移動,代碼的簡單實現了,僅供參考,歡迎討論交流。
總結
以上是生活随笔為你收集整理的JS 实现列表移动(JQuery实现)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: LTE帧结构----符号长度
- 下一篇: C解决duplicate symbol