zoukankan      html  css  js  c++  java
  • 用jQuery解决弹出层的问题

    在BS 项目中 经常需要用到这种弹出层。
    做这种弹出层一般都会遇到下面几个问题:
    0,弹出层必须定义在input的下边显示。
    1,点击input弹出div层。
    2,点击div层外面任何地方,关闭div层。
    3,ie6下,div层与下拉框的优先级问题。

    下面这个例子就是解决这些问题的,大家可以参考参考,有什么更好的解决方案,请留言。

    超级简单版 演示:
    http://cssrain.cn/demo/popDiv/easyPopDiv.html

    实例版 演示:
    http://cssrain.cn/demo/popDiv/popDiv.html

    下载:
    http://cssrain.cn/demo/popDiv/popDiv.rar

    此弹出框特点:
    1,弹出层出现在 文本框 下面.
    2,点击弹出层内部 不关闭层,点击外面关闭弹出层.
    3,ie6依然能遮住下拉框.

    当时遇到的问题以及解决方案 :
    1,获取文本框的高度,当初用的.height(),结果发现有问题,border等都没算进去,后来改用.outerHeight(true)解决。
    2,阻止事件冒泡,当初用的return false;结果弄的多选框不能选了,
    因为return false包括e.stopPropagation()和e.preventdefault(),e.preventdefault()会阻止元素的默认动作,
    所以多选框不能选中了。改用e.stopPropagation()后,一切正常。
    3,$("body")和$(document)的区别,因为body的高度未知,所以导致click()事件无效,改为$(document) 解决。
    4,ie6下,层与下拉框的问题,采用jquery.bigframe插件解决。

    本篇文章来源于 cssrain.cn 原文链接:http://www.cssrain.cn/article.asp?id=1317

  • 相关阅读:
    cmd 命令添加防火墙端口
    linux 远程 telnet
    topshelf 服务启动运行
    postfix 邮箱服务器- SPF 防发件人欺骗
    linux 只查看目录下文件夹
    Android中的颜色设置
    thread和runnable
    Handler总结
    Failed to install Intel HAXM.
    Android Studio常见问题总结
  • 原文地址:https://www.cnblogs.com/scgw/p/1434510.html
Copyright © 2011-2022 走看看