jq选择框--选中左侧元素,点击按钮会移动到右侧框
作者:互联网
---------------------------html-----------------------------
<div class="main">
<div class="left">
<select name="leftDemo" multiple="multiple">
<option value="">蔡徐坤</option>
<option value="">谢广坤</option>
<option value="">李小龙</option>
<option value="">施瓦辛格</option>
</select>
</div>
<div class="center">
<button class="allyou">>>></button>
<button class="allzuo"><<<</button>
<button class="you">></button>
<button class="zuo"><</button>
</div>
<div class="right">
<select name="rightDemo" multiple="multiple">
</select>
</div>
</div>
----------------------------------------jq-------------------------------------
//将左侧元素全部移到右边
$('.allyou').click(function(){
$('.left select option').appendTo('.right select')
})
//将右边元素全部移到左边
$('.allzuo').click(function(){
$('.right select option').appendTo('.left select')
})
//将左侧选中元素移到右边
$('.you').click(function(){
$('.left select option:checked').appendTo('.right select')
})
//将右侧选中元素移到左边
$('.zuo').click(function(){
$('.right select option:checked').appendTo('.left select')
})
标签:function,right,option,--,jq,appendTo,按钮,click,select 来源: https://www.cnblogs.com/alannero/p/14946754.html