码迷,mamicode.com
首页 > 其他好文 > 详细

jq效果 点击隐藏和显示(组织冒泡事件)

时间:2014-08-22 12:39:26      阅读:175      评论:0      收藏:0      [点我收藏+]

标签:style   java   io   div   cti   代码   javascript   sp   

一个button按钮,当我点击button后弹出DIV层,

当我点击DIV层以外的地方时候把DIV隐藏

大概代码如下:

    <input type="button" id="js_button" />
    <div id="js_div" style="width: 100px; height: 100px;  display: none">
    </div>
    <script type="text/javascript">
        $(document).ready(
     function () {
         $("#js_button").click(function (e) {
             $("#js_div").show(300);
             /*阻止冒泡事件*/
             e = window.event || e;
             if (e.stopPropagation) {
                 e.stopPropagation();
             } else {
                 e.cancelBubble = true;
             }

         });
         $("#js_div").click(function (e) {
             /*阻止冒泡事件*/
             e = window.event || e;
             if (e.stopPropagation) {
                 e.stopPropagation();
             } else {
                 e.cancelBubble = true;
             }
         });
         $(document).click(function () {
             $("#js_div").hide(300);
         });
     }
     );
    </script>

jq效果 点击隐藏和显示(组织冒泡事件),布布扣,bubuko.com

jq效果 点击隐藏和显示(组织冒泡事件)

标签:style   java   io   div   cti   代码   javascript   sp   

原文地址:http://www.cnblogs.com/447262548qq/p/3929017.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!