教程集 www.jiaochengji.com
教程集 >  jQuery  >  jquery 教程  >  正文 使用jquery实现select添加实现后台权限添加的效果

使用jquery实现select添加实现后台权限添加的效果

发布时间:2013-07-02   编辑:jiaochengji.com
使用jquery实现select添加实现后台权限添加的效果,需要的朋友可以参考下。
使用jquery实现select添加实现后台权限添加的效果,需要的朋友可以参考下。

呃。其实很简单的东西啦。页面的图

两个列表都可以多选,

实现如下效果:

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>

您可能感兴趣的文章:
使用jquery实现select添加实现后台权限添加的效果
细说 jQuery 插件篇(二) – 添加实例方法
mysql user表增加连接用户帐号的方法
mysql新建用户与用户授权详解
DB2实验教程-管理权限
django如何添加权限
jquery $.fn $.fx是什么意思有什么用
django 怎么写权限
mysql命令-常用sql语句命令代码
JQuery在页面中添加和除移DOM示例代码

[关闭]
~ ~