名站网址导航为大家提供关于网站网页设计设计相关的的教程知识。
- 本篇文章具体介绍如下
呃。其实很简单的东西啦。页面的图
两个列表都可以多选，
实现如下效果：
1、双击第一个列表中任意一个列表项，实现向下添加
2、双击第二个列表中任意一个列表项，实现删除，
2、点击按钮，实现对应功能。
html具体代码
<form name="form1" method="post" action="">
<select id="select1" size="5" multiple style="width:100px " >
<option value="111">北京</option>
<option value="222">上海</option>
<option value="333">广州</option>
<option value="333">山东</option>
<option value="333">常州</option>
</select><br/><br/>
<input type="button" id="button1" value="添加">
<input type="button" id="button2" value="删除"><br/><br/>
<select id="select2" size="5" multiple style="width:100px " >
</select>
</form>
jquery具体代码
具体代码如下:
<script src="js/jquery-1.6.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#select1").dblclick(function () { $("#select1 :selected").appendTo($("#select2")); });
$("#select2").dblclick(function () { $("#select2 :selected").appendTo($("#select1")); });
$("#button1").click(function () { $("#select1 option:selected").appendTo($("#select2")); });
$("#button2").click(function () { $("#select2 option:selected").appendTo($("#select1")); });
})
</script>
好了关于网站网页设计设计相关的这篇文章就给大家介绍到这里不明白的地方给本站留言。声明，本站内容来源于互联网，如果侵犯了你的权益请联系本站删除。,10款新鲜出炉的 jQuery 插件(Ajax 插件，有幻灯片、图片画廊、菜
一款用于实现漂亮的Chrome风格图片画廊的 jQuery 插件，在线演示
