jquery select 移动

最新推荐文章于 2022-11-13 11:38:25 发布

PerfectUrl

最新推荐文章于 2022-11-13 11:38:25 发布

阅读量283

点赞数

分类专栏： Jquery

本文链接：https://blog.csdn.net/PerfectUrl/article/details/70254974

版权

13 篇文章 0 订阅

订阅专栏

<body>
	<h2>select 移动</h2>
	<select multiple="multiple" id="shandong">
	<option>青岛</option>
	<option>烟台</option>
	<option>济南</option>
	<option>潍坊</option>

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

	<select multiple="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(){

关注

专栏目录