Question

    function MyConfirm(message, callback) {
            console.log("In My Confirm");
            var ids = document.getElementById("mymodal");
            $('#MyText').html(message);
           
            ids.style.display = "block"
           
            $('input[id^=cfrm_]').click(function (e) {
                e.preventDefault();
                console.log("In Click Event");
                if (typeof callback === 'function') {
                    callback($(this).attr('value'));
                }
                ids.style.display = "none"
            });            
        }

        var as="My Test Message";

        function mytest(){
            var na = MyConfirm(as, function (result) {
                console.log("Result: "+result)
            });

        }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    </head>
    <body>
    <form id="form1" runat="server">
    <div>
    
        <input id="Button1" type="button" onclick="mytest()" value="button" /></div>
       <div id="mymodal" style="display:none">
            <div id="MyText"></div>
            <input id="cfrm_btnYes" type="button" value="Yes" />
            <input id="cfrm_btnNo" type="button" value="No" />
        
           </div>
    </form>
</body>
</html>

我使用上面的代码来模仿默认的确认对话框窗口操作。功能正常。但是在单击按钮时，调用mytest（）并使用两个按钮按预期显示div #mymodal。但是，当您单击是或否按钮时，它会隐藏div，但它会多次循环通过MyConfirm功能。它可以在控制台中看到。任何人都可以解释一下为什么我得到这个奇怪的回应。我的目标是为confirm（）fn创建一个替代。带有返回值。

Answer 1

请尝试使用return。也许它会准备好。

Answer 2

问题是您绑定了一个新的click事件，以确认按钮每个时间MyConfirm()函数执行。 click事件绑定不会覆盖旧绑定，但会为该事件添加新函数。

您可以添加$('input[id^=cfrm_]').off('click');以在绑定新绑定之前删除旧绑定。

＆＃13;

function MyConfirm(message, callback) {
            console.log("In My Confirm");
            var ids = document.getElementById("mymodal");
            $('#MyText').html(message);
           
            ids.style.display = "block"
           
            $('input[id^=cfrm_]').off('click');
           
            $('input[id^=cfrm_]').click(function (e) {
                e.preventDefault();
                console.log("In Click Event");
                if (typeof callback === 'function') {
                    callback($(this).attr('value'));
                }
                ids.style.display = "none"
            });            
        }

        var as="My Test Message";

        function mytest(){
            var na = MyConfirm(as, function (result) {
                console.log("Result: "+result)
            });

        }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    </head>
    <body>
    <form id="form1" runat="server">
    <div>
    
        <input id="Button1" type="button" onclick="mytest()" value="button" /></div>
       <div id="mymodal" style="display:none">
            <div id="MyText"></div>
            <input id="cfrm_btnYes" type="button" value="Yes" />
            <input id="cfrm_btnNo" type="button" value="No" />
        
           </div>
    </form>
</body>
</html>

＆＃13;

使用javascript回调的Jquery Click事件已经多次执行gertting

2 个答案: