首页 网页制作网络编程脚本专栏数据库网站运营网络安全平面设计CMS教程

select不支持双击dbclick事件

所属分类： 网页制作 / HTML/Xhtml 阅读数： 653
收藏 0 赞 0 分享
XML/HTML Code复制内容到剪贴板
  1. <div class="centent" style="width:200px; float:left; margin-right:20px;">    
  2. <select multiple="multiple" id="select1" style="width:150px; height:160px;">    
  3. <option value="1">选项1</option>    
  4. <option value="2">选项2</option>    
  5. <option value="3">选项3</option>    
  6. <option value="4">选项4</option>    
  7. <option value="5">选项5</option>    
  8. </select>    
  9.   
  10. <div>    
  11. <span id="add" style="display:block; width:140px; cursor:pointer;">选中添加到右边>></span>    
  12. <span id="addAll" style="display:block; width:140px; cursor:pointer;">全部添加到右边>></span>    
  13. </div></div>    
  14. <div class="centent" style="width:200px; float:left; margin-right:20px;">    
  15. <select multiple="multiple" id="select2" style="width:150px; height:160px;">    
  16. </select>    
  17. <div>    
  18. <span id="add1" style="display:block; width:140px; cursor:pointer;"><<选中删除到左边</span>    
  19. <span id="addAll1" style="display:block; width:170px; cursor:pointer;"><<全部选中删除到左边</span>    
  20. </div>    
  21. </div>  
JavaScript Code复制内容到剪贴板
  1. <script type="text/javascript">    
  2.   
  3. //下拉框多选的应用 9：57    
  4. $(function(){    
  5. //开始把左边的添加到右边    
  6. $("#add").click(function(){ //把选中的添加到右边    
  7. $option = $("#select1 option:selected");    
  8. $option.appendTo("#select2");    
  9. })    
  10. $("#addAll").click(function(){ //全部添加到右边    
  11. $option = $("#select1 option");    
  12. $option.appendTo("#select2");    
  13. })    
  14. $("#select1").dbclick(function(){ //双击添加到右边    
  15. $option = $("#select1 option:selected",this);    
  16. $option.appendTo("#select2");    
  17. })    
  18. //开始右边的添加到左边    
  19. $("#add1").click(function(){ //把选中的添加到左边    
  20. $option = $("#select2 option:selected");    
  21. $option.appendTo("#select1");    
  22. })    
  23. $("#addAll1").click(function(){ //全部添加到左边    
  24. $option = $("#select2 option");    
  25. $option.appendTo("#select1");    
  26. })    
  27. $("#select2").dbclick(function(){ //双击添加到左边    
  28. $option = $("option:selected",this);    
  29. $option.appendTo("#select1");    
  30. })    
  31. })    
  32. </script>
更多精彩内容其他人还在看

Table相关整理及Javascript操作table,tr,td

很多人都有这种经历：当某个td中没有内容或者没有可见元素时，td的border也会消失。本文将给出解决方案，感兴趣的朋友可以了解下，或许本文对你有所帮助
收藏 0 赞 0 分享

td 内容自动换行 table表格td设置宽度后文字太多自动换行

table表格td设置宽度后文字太多导致自动换行，这是一个很常见的问题,或许很多的网友已经有了好的解决方法,如果依然有童鞋们不会的，可以参考下本文，可能会有意外的收获
收藏 0 赞 0 分享

html4和html5区别之如何在一个input上添加焦点实现代码

如何在一个input上添加焦点,有很多的实现方法，本文分别用html4和html5做了下演示，感兴趣的朋友可以参考下，或许本文对你有所帮助
收藏 0 赞 0 分享

纯css为select添加样式(无脚本)实现

改变select默认的样式，一般情路情况下通过ul,li来模拟来实现;Jquery插件也是这样,接下来介绍一种不写脚本，只用单纯的css来实现。在IE系列下，选中某个选项的时候会有背景色块，IE7-IE10都有此bug，感兴趣的朋友可以参考下啊
收藏 0 赞 0 分享

iframe的src赋值问题(服务器端)

frame的src赋值的问题，本文将进行详细探讨:服务器端的iframe重新src重新赋值,给iframe加一个ID，再加上runat=server，感兴趣的你可不要错过了哈
收藏 0 赞 0 分享

iframe的src设置为about:blank之后细节探讨

不设置为about:blank，内存不会释放掉。还必须用 iframe.document.write(''); 这样才能将内容清空，本文将详细探讨一下iframe的src设置为about:blank之后细节，感兴趣的你可不要错过了哈
收藏 0 赞 0 分享

无法定义IE6字体：13px大小无效，IE6自动显示更大的字体的解决方法

前些天调整网页一个模块的时候将页面字体的大小设置为13px大小了，由于当时用的是Chrome浏览器以及IE8，并没有发现原来font-size:13px在IE6下居然不听使唤总是自动显示为一个更大的大小，变现上又及其难看
收藏 0 赞 0 分享

为何html中嵌入mp4格式视频播放不了

只是在页面中加载了一个播放器的样子，各个按钮都不管用，不知道是哪个地方出了问题，很是郁闷，于是搜集整理下，拿出来和大家分享，希望可以帮助你们
收藏 0 赞 0 分享

如何把select下拉框的值传到id中实现代码

把select下拉框的值传到id中,是网友们比较在意的问题，本人搜索整理下，晒出来和大家分享
收藏 0 赞 0 分享

怎么把select下拉菜单里的文字设置成左右滚动效果

希望用marquee标签来设置字体滚动，代码是下面这样写的，但是没有效果，字体还是不会滚动，应该怎么来写，才会实现这个效果呢
收藏 0 赞 0 分享
查看更多

网络赚钱

更多

站长故事

更多
建站极客
合作伙伴
在线工具
建站极客移动版
聚合全网技术文章，根据你的阅读喜好进行个性推荐
© 2012 - 2020 www.zhanzhang360.cn Some Rights Reserved.
沪ICP备13040166号-22