jQuery UI对话确认

时间:2009-05-04 17:32:26

标签: javascript jquery

我正在尝试使用jQuery UI对话框在执行操作之前显示确认...在这种情况下导航到所选链接....但在另一种情况下,我可能想使用AJAX删除。

我以为我可以将操作作为custom_confirm函数的参数传递:

   $("a.edit").click(function(e){
       e.preventDefault();
       custom_confirm('Please Note:',
           function(){
               location.href = $(this).attr('href');
           }
       );
   });

   function custom_confirm(prompt, action, title){
    if (title === undefined) title = "Are you sure?";
    if ($("#confirm").length == 0){
        $("#main div.inner").append('<div id="confirm" title="' + title + '">' + prompt + '</div>');
        $("#confirm").dialog({buttons: {'Proceed': function(){ $(this).dialog('close'); action; }, Cancel: function(){ $(this).dialog('close'); }}});
    }
    else {
        $("#confirm").html(prompt);
        $("#confirm").dialog('open');
    }
}

它不起作用。还有另一种方法可以实现这个目标吗?


感谢快速回复的人。我尝试了你的建议,但它仍然没有执行作为参数传递的函数。

    $("a.edit").click(function(e){
       e.preventDefault();
       var href = $(this).attr('href');
       custom_confirm('Please Note:',
           function(){
console.log(href);
               location.href = href;
           }
       );
   });

清理了custom_confirm函数,添加了关闭选项:

function custom_confirm(prompt, action, title){
    if (title === undefined) title = "Are you sure?";
    $("#main div.inner").append('<div id="confirm" title="' + title + '">' + prompt + '</div>');
    $("#confirm").dialog({position: 'top', width: 700, modal: true, resizable: false, show: "fold", hide: "blind", buttons: {'Proceed': function(){ $(this).dialog('close'); action(); }, Cancel: function(){ $(this).dialog('close'); }}, close: function(ev, ui) { $(this).remove();}});
}

3 个答案:

答案 0 :(得分:2)

想出来。如果要将函数作为参数传递给另一个函数,则需要将该参数作为函数

调用
action()

而不是作为变量

action

希望有所帮助

$("a.edit").click(function(e){
    e.preventDefault();
    var href = $(this).attr('href');
    custom_confirm('Please Note:',
        function(){
            location.href = href;
        }
    );
});

function custom_confirm(prompt, action, title){
    if (title === undefined) title = "Are you sure?";
        if ($("#confirm").length == 0){
            $("#main div.inner").append('<div id="confirm" title="' + title + '">' + prompt + '</div>');
            $("#confirm").dialog({buttons: {'Proceed': function(){ $(this).dialog('close'); action(); }, Cancel: function(){ $(this).dialog('close'); }}});
        }
        else {
            $("#confirm").html(prompt);
            $("#confirm").dialog('open');
    }
}

答案 1 :(得分:0)

您需要使用闭包传递this变量。

See this example.(改进)

   $("a.edit").click(function(e){
       e.preventDefault();
       custom_confirm('Please Note:',
           (function (element) {
             return function(element){
               location.href = $(element).attr('href');
           })(this)
       );
   });

但是你想要做的事情可以用以下几点来完成:

$("a.edit").each(function() {
  $(this).click(function() {
    if (!confirm("Are you sure about that?"))
       e.preventDefault();
  });
});

答案 2 :(得分:0)

是,或者干脆:

$("a.edit").click(function(e){
       e.preventDefault();
       var href = $(this).attr('href');
       custom_confirm('Please Note:',
           function(){
               location.href = href;
           }
       );
   });