热门关键字:
jquery > jquery插件 > jquery下拉菜单 > 网友小李分享Jquery实现角色左右选择特效

网友小李分享Jquery实现角色左右选择特效

8653
所属分类:jquery下拉菜单
发布时间:2013/2/17 16:12:38
下载量:1727
评论数:1
转载请自觉注明原文:http://www.jq-school.com/Detail.aspx?id=157

首先非常感谢网友小李的无私分享,此Jquery特效是一款非常实用的功能,前段时间Jquery学堂QQ群里有网友问起Jquery可不可以实现啊,当时没有去试一下还以为只有Winform才可以实现的,今天网友小李把他写的作品分享出来给大家用。


包括了以下功能:

1、单选操作

2、多选操作(按Ctrl+鼠标点击或按Shift+鼠标点击都可以)

3、双击当前选项也可添加


核心代码如下:


$(function(){
    //移到右边
    $('#add').click(function() {
    //获取选中的选项,删除并追加给对方
        $('#select1 option:selected').appendTo('#select2');
    });
    //移到左边
    $('#remove').click(function() {
        $('#select2 option:selected').appendTo('#select1');
    });
    //全部移到右边
    $('#add_all').click(function() {
        //获取全部的选项,删除并追加给对方
        $('#select1 option').appendTo('#select2');
    });
    //全部移到左边
    $('#remove_all').click(function() {
        $('#select2 option').appendTo('#select1');
    });
    //双击选项
    $('#select1').dblclick(function(){ //绑定双击事件
        //获取全部的选项,删除并追加给对方
        $("option:selected",this).appendTo('#select2'); //追加给对方
    });
    //双击选项
    $('#select2').dblclick(function(){
       $("option:selected",this).appendTo('#select1');
    });
});


效果如下:

网友小李分享Jquery实现角色左右选择特效






如果您觉得本作品对您的学习有所帮助:支付鼓励



关键字:角色选择 多选下拉框 三级联动 下拉框
  • 网友小李分享Jquery实现角色左右选择特效如果你喜欢学院的资源就下载吧,亲,谢谢!
  • 网友小李分享Jquery实现角色左右选择特效
  • 网友小李分享Jquery实现角色左右选择特效
  • 提示:如果网络问题无法下载,请多尝试几次,与 网站管理员联系 或 本站留言 !

声明: 本站内容均为网友原创或整理于互联网,版权归作品最初创作人,转载请注明(出处)原文链接,转载前请邮件至磐temdy@qq.com,一旦发现造成侵权行为,后果自负。。

友荐云推荐