kasuel
2019-09-16 09:29
采纳率: 75%
浏览 496

web前端小白分组控件请教

有经验的前辈看一下,下面的控件是要自己实现还是有现成的控件可以直接用,拜托了。

图片说明

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

3条回答 默认 最新

  • a22222222q 2019-09-16 09:32
    已采纳

    有写好的代码,看这里:https://www.2cto.com/kf/201708/663353.html

    问题解决请采纳,急需c币

    点赞 打赏 评论
  • <meta charset="UTF-8" />
    <title></title>
    <script src="js/jquery-1.8.3.js"></script><script type="text/javascript">
                $(document).ready(function(){
                    //将左边数据移动到右边
                    $("#right").click(function(){
                    //将左边option中选中的值赋给vSelect变量
                    var vSelect=$("#leftSelect option:selected");
                    //将数据添加到rightSelect中
                    vSelect.clone().appendTo("#rightSelect");
                    //同时删除leftSelect中的数据
                    vSelect.remove();                   
                    });
    
                    //将右边数据移动到左边
                    $("#left").click(function(){
                        var vSelect=$("#rightSelect option:selected");
                        //将右边的数据追加到左边列表中
                        vSelect.clone().appendTo("#leftSelect");
                        vSelect.remove();
                    });
    
                    //将左边全部数据移到右边
                    $("#rightAll").click(function(){
                        $("#rightSelect").append($("#leftSelect>option"));
                        $("#leftSelect>option").remove();
                    });
    
                    //将右边数据全部移到左边
                    $("#leftAll").click(function(){
                        $("#leftSelect").append($("#rightSelect>option"));
                        $("#rightSelect>option").remove();
                    });
                });
    
            </script>
    <select id="leftSelect" multiple="multiple"><option value="0">电影0</option><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></select> <input id="right" type="button" value="&gt;" /> <input id="rightAll" type="button" value="&gt;&gt;&gt;" /> <input id="left" type="button" value="&lt;" /> <input id="leftAll" type="button" value="&lt;&lt;&lt;" /> <select id="rightSelect" multiple="multiple"><option value="6">电影6</option><option value="7">电影7</option><option value="8">电影8</option><option value="9">电影9</option></select>
    
    点赞 打赏 评论
  • zhangxuchaocsdn 2019-09-16 11:13
    点赞 打赏 评论

相关推荐 更多相似问题