jquery select 移动

来源:互联网 发布:数据分析相关岗位 编辑:程序博客网 时间:2024/06/06 09:27
<body>
<h2>select 移动</h2>
<selectmultiple="multiple"id="shandong">
<option>青岛</option>
<option>烟台</option>
<option>济南</option>
<option>潍坊</option>


</select>
<inputtype="button"value="-->"onclick="toRight()" />
<inputtype="button"value="==>"onclick="toAllRight()" />
<inputtype="button"value="<--"onclick="toLeft()" />
<inputtype="button"value="<=="onclick="toAllLeft()" />


<selectmultiple="multiple"id="beijing">
<option>朝阳</option>
<option>大兴</option>
<option>通州</option>
<option>海淀</option>


</select>
</body>
</html>
<script>
$(document).ready(function(e) {
$("option").dblclick(function(){
if($(this).parent().attr('id')=='shandong'){
$(this).appendTo($('#beijing'));
}else{
$(this).appendTo($('#shandong'));
}
//alert($(this).parent().attr('id'));
});
});
function toRight(){
$("#shandong option:selected").appendTo($("#beijing"))
}
function toAllRight(){
$("#shandong option").appendTo($("#beijing"))
}
function toLeft(){
$("#beijing option:selected").appendTo($("#shandong"))
}
function toAllLeft(){

0 0