Question

我已经搞砸了一段时间并尝试了很多方法。它仍然无法工作。

function popupConfirm(widtH, texT, callback){ 
var top=(window.innerHeight/2) - 100;
var left=(window.innerWidth/2) - (widtH/2);
var r="<div id='standard-modal' style='width:"+widtH+"px;top:"+top+"px;left:"+left+"px;'>";
        r+="<div id='standard-modal-header' style='width:"+(widtH-4)+"px;'>";
        r+="<strong>&rarr; &nbsp; Icon Box &nbsp; &larr;</strong>";
        r+="</div>";
        r+="<div id='standard-modal-message' style='width:"+(widtH-30)+"px;'>"+texT+"</div>";
            r+="<div id='button_wrapper'><div id='standard-modal-button' class='left_button' onclick='$(\"#standard-modal\").remove();' >CANCEL</div>";

            // following line attaches callback to onclick event        
            r+="<div id='standard-modal-button' class='right_button' onclick='callback();' >CONFRIM</div></div>";
        r+="<div style='clear:both;'></div></div>";

$('body').append(r);
}


popupConfirm(300,'blah blah' , function(){alert("finally");});

理论上，我想让它在我的弹出窗口中点击确认后发出警报......任何帮助都表示赞赏。

其日志到控制台'回调未定义'

Answer 1

这是一个经典的范围问题，当您将字符串附加到正文然后用户点击div时onclick正试图触发名为window.callback()的函数。而不是使用通常不是一个好主意的内联javascript，无论如何都是在创建html后绑定点击处理程序。

...
        // following line attaches callback to onclick event        
        r+="<div id='standard-modal-button' class='right_button'>CONFRIM</div></div>";
    r+="<div style='clear:both;'></div></div>";

    $('body').append(r);
    $('#standard-modal-button').bind('click', callback);
}

Answer 2

我会使用click（）而不是尝试将回调放入你的函数中。

$('.right_button').on('click', function() {
    alert("finally");
});

Answer 3

我甚至不知道从哪里开始告诉你要改变什么，除了一切。首先，我开始实际创建div作为页面的一部分并隐藏它。何时应该显示;你可以做$('#standard-modal').show();。然后，您可以执行其他答案中建议的内容，例如：

$('#cancel-btn').click(function(){
    alert('your message');
});

如果您仍有问题，请查看jqueryUI http://jqueryui.com/demos/dialog/

Answer 4

有点危险但是：

 r+="<div id='standard-modal-button' class='right_button' onclick='eval('(" + callback.toString() + ")()');' >CONFRIM</div></div>";

将回调函数传递给onclick事件

4 个答案: