Question

我有一个表单index.asp

<div class="wrapper pop-up" id="pop_up" style="display:none;"></div>
<div class="log_in">
        <a href="/Login.asp" class="LogInBut" id="LogIn">Login</a>
</div>

的login.asp

<div class="authorize" id="authorizeID" >

    <a href="#" id="authorize-closeBut" class="authorize-close">
        <img src="img/icons/cross.png" />
    </a>

    <div id="response"> </div>
    <div class="authorize-footer">
        <a href="/ForgotPassword.asp"  class="LogInBut" id="passremainderBut">ForgotPassword</a>
        <a href="/Register.asp"  class="LogInBut"  id="registrationBut">Registration</a>
    </div>
</div>

ForgotPassword.asp

<div class="authorize" id="passremainderID" >
    <a href="#" id="passremainder-closeBut" class="authorize-close">
        <img src="img/icons/cross.png" />
    </a>
</div>

我有一个javascript

$(".LogInBut").on('click', function(e) {
        e.preventDefault();

        $.get($(this).attr('href'), function(data) {
            alert($('#pop_up').length);
            if ($('#pop_up').length) {
                $('#pop_up').html(data).show(function() {
                    $('.authorize-close').click(function(e){      
                        e.preventDefault();
                        if ($('#pop_up').length) {
                            $('#pop_up').html("");
                            $('#pop_up').hide(); 
                        }
                    });
                });
            }
        });
});

因此，如果我将此javascript插入到Index.asp页面并单击#LogIn，我会在Login.asp和一次警报（$（'＃pop_up'）。length）;的弹出窗口中显示，如果我点击{ {1}}窗口将关闭。如果我再次单击#LogIn，我会得到相同但警报（$（'＃pop_up'）。length）;出现两次，每次点击#LogIn时都会递增。

那么如何防止递增并仅显示此警报？

Answer 1

每当您点击按钮时......您正在为#pop_up

创建一个新的事件点击

$('.authorize-close').click(function(e){

它显示两次，因为你创建了两次事件。您需要删除旧事件，而不是再次创建..将行更改为：

$('.authorize-close').unbind('click').bind('click',function(e){

Javascript递增自己

1 个答案: