jquery 操作两个select实现值之间的互相传递
更新时间:2014年03月07日 09:04:07 作者:
本篇文章主要是对jquery操作两个select实现值之间的互相传递进行了详细的介绍,需要的朋友可以过来参考下,希望对大家有所帮助
复制代码 代码如下:
function moveToRight(select1,select2)//把选中的移动到右边 sleect1和sleect2分别是下拉列表框的ID
{
$('#'+select1+' option:selected').each(function(){
$("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>").appendTo("#"+select2+"");
$(this).remove();
$('#'+select2).bind('dblclick',function(){
moveToLeft(select1,select2);
});
});
}
function moveAllToRight(select1,select2)//把所有的移动到右边
{
$('#'+select1+' option').each(function(){
$("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>").appendTo("#"+select2+"");
$(this).remove();
});
}
function moveToLeft(select1,select2)//把选中的移动到左边
{
$('#'+select2+' option:selected').each(function(){
$("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>").appendTo("#"+select1+"");
$(this).remove();
});
}
function moveAllToLeft(select1,select2)//把所有的移动到左边
{
$('#'+select2+' option').each(function(){
$("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>").appendTo("#"+select1+"");
$(this).remove();
});
}
如果要双击select中的某一个option就把当前值传到另一个select需要bind一个select 事件 如下即可
复制代码 代码如下:
$('#sel2').bind('dblclick',function(){//给下拉框绑定双击事件
moveToRight('sel2','sel3');
});
$('#sel3').bind('dblclick',function(){
moveToLeft('sel2','sel3');
});
您可能感兴趣的文章:
- 基于JQuery实现的Select级联
- jquery取消选择select下拉框示例代码
- jquery实现省市select下拉框的替换(示例代码)
- jQuery取得设置清空select选择的文本与值
- jquery制作select列表双向选择示例代码
- jquery 实现两Select 标签项互调示例代码
- jQuery制作简洁的多级联动Select下拉框
- jQuery中:selected选择器用法实例
- jquery操作select方法汇总
- Jquery对select的增、删、改、查操作
- jquery实现动态操作select选中
- JQuery select(下拉框)操作方法汇总
- jquery使用ul模拟select实现表单美化的方法
- jQuery实现的仿select功能代码
- 基于jquery实现select选择框内容左右移动添加删除代码分享
相关文章
通过JQuery实现win8一样酷炫的动态磁贴效果(示例代码)
相信大家喜欢这个界面无非也是喜欢它的动态磁贴。刚好今天研究了一下如何通过JQuery在网页上模仿这种效果,就贴出来给大家喷一下。虽然是一些很低级的技术,但是也希望有需要的朋友可以参考下2013-07-07jquery UI Datepicker时间控件的使用方法(基础版)
这篇文章主要介绍了jquery ui datepicker时间控件的使用方法,需要的朋友可以参考下2015-11-11浅谈jquery选择器 :first与:first-child的区别
下面小编就为大家带来一篇浅谈jquery选择器 :first与:first-child的区别。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧2016-11-11jQuery Selectors(选择器)的使用(四-五、内容篇&可见性篇)
本系列文章主要讲述jQuery框架的选择器(Selectors)使用方法,我将以实例方式进行讲述,以简单,全面为基础,不会涉及很深,我的学习方法:先入门,后进阶!2009-12-12
最新评论