仅执行一次jquery

时间:2013-12-11 18:31:07

标签: jquery dialog

任何人都可以帮助我,我在这里有一个脚本,当你的鼠标离开页面时显示一个对话框,但我只想让它执行一次,在第一次之后,我不希望它再次发生。 这是我的代码:

<html>
<head>
<style>
#dialog {
    width:652px;
    margin-right:auto;
    margin-left:auto;
    display:none;
}
</style>
 <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>

function show_image(src, width, height, alt) {
    var img = document.createElement("img");
    img.src = src;
    img.width = width;
    img.height = height;
    img.alt = alt;

    // This next line will just add it to the <body> tag
    document.body.appendChild(img);
}

</script>
<script type="text/javascript">
var count = 0;
function addEvent(obj, evt, fn) {
    if (obj.addEventListener) {
        obj.addEventListener(evt, fn, false);
    }
    else if (obj.attachEvent) {
        obj.attachEvent("on" + evt, fn);
    }
}
addEvent(window,"load",function(e) {
    addEvent(document, "mouseout", function(e) {
        e = e ? e : window.event;
        var from = e.relatedTarget || e.toElement;
        if (!from || from.nodeName == "HTML") {
            // stop your drag event here
            // for now we can just use an alert
            if (count < 1) {
              $(function() {
                var count = 1;
                $( "#dialog" ).dialog({
                width:692
                });
                });
            }
        }
    });
});
</script>
</head>
<body>
<div id="dialog">
<img src="http://www.maxcashtitleloans.com/POPUPIMAGE.jpg">
</div>
</body>
</html>

任何帮助都会很棒!谢谢。

3 个答案:

答案 0 :(得分:4)

您需要count = 1;

而不是var count = 1;(〜第47行)

count = 0;代替var count = 0;(第29行)

第29行(var count = 0;)定义变量'count',但是代码中的count不能被覆盖或增加,因为它不在同一范围内。

答案 1 :(得分:1)

复制/粘贴此代码,看看它是否适合您:

<html>
<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
    <link rel="stylesheet" href="/resources/demos/style.css">

        <style>
            #dialog {
                width:652px;
                margin-right:auto;
                margin-left:auto;
                display:none;
            }
        </style>

        <script type="text/javascript">
            $(document).ready(function() {
                var count = 0;

                function show_image(src, width, height, alt) {
                    var img = document.createElement("img");
                    img.src = src;
                    img.width = width;
                    img.height = height;
                    img.alt = alt;

                    // This next line will just add it to the <body> tag
                    document.body.appendChild(img);
                }
                function addEvent(obj, evt, fn) {
                    if (obj.addEventListener) {
                        obj.addEventListener(evt, fn, false);
                    }
                    else if (obj.attachEvent) {
                        obj.attachEvent("on" + evt, fn);
                    }
                }
                addEvent(window,"load",function(e) {
                    addEvent(document, "mouseout", function(e) {
                        e = e ? e : window.event;
                        var from = e.relatedTarget || e.toElement;
                        if (!from || from.nodeName == "HTML") {
                            // stop your drag event here
                            // for now we can just use an alert
                            if (count < 1) {
                                $(function() {
                                    count = 1;
                                    $( "#dialog" ).dialog({
                                        width:692
                                    });
                                });
                            }
                        }
                    });
                });

            }); //END $(document).ready()

        </script>
    </head>
<body>

    <div id="dialog">
        <img src="http://www.maxcashtitleloans.com/POPUPIMAGE.jpg">
    </div>

</body>
</html>

答案 2 :(得分:0)

您有两种选择:

1_取消绑定事件(你需要为此使用jquery事件)

$(this).unbind("mouseOut");

2_这是更糟糕的方式并使用这样的标志

var flag=1;
addEvent(window,"load",function(e) {
    addEvent(document, "mouseout", function(e) {
        if(flag){
            flag=0;
            e = e ? e : window.event;
            var from = e.relatedTarget || e.toElement;
            if (!from || from.nodeName == "HTML") {
                // stop your drag event here
                // for now we can just use an alert
                if (count < 1) {
                    $(function() {
                        var count = 1;
                        $( "#dialog" ).dialog({
                            width:692
                        });
                    });
                }
            }
        }
    });
});