jQueryUI对话框替换确认？

我试图重写与jQueryUI的对话框中的默认确认框，这里是我的尝试：jQueryUI对话框替换确认？

window.confirm = function (message_confirm) { 
     $(document.createElement('div')) 
      .attr({ title: 'Please confirm', 'class': 'confirm', 'id': 'dialogconfirm' }) 
      .html(message_confirm) 
      .dialog({ 
       buttons: { YES: function() { return true; }, NO: function() { $(this).dialog('close'); } }, 
       close: function() { $(this).remove(); }, 
       draggable: true, 
       modal: true, 
       resizable: false, 
       width: 'auto', 
       hide: { effect: "fade", duration: 300 }, 

      }); 

    };

这工作，因为一旦这个脚本的运行，调用定期confirm显示jQueryUI的对话框，但是，YES选择不起作用。我有一个像下面这样的ajax调用：

if (confirm("Are you sure you want to delete this user?")) 
{ 
     alert("test"); 
    //ajax call 
} 
return false;

而测试警报没有出现。对话的NO选项没问题。我怎样才能让YES工作？

谢谢。

来源

2016-08-02 ITWorker

任何错误？尝试与console.log而不是警报？ console.log是否在“YES：”函数中工作（用return true替换）？ – ggzone

@ggzone没有错误。用'console.log（“对话框被点击”）代替'return true'，并且当我点击是时它在控制台上正确显示。 console.log代替警报也没有出现（与原始警报测试相同的行为）。 – ITWorker

好吧，你想要一个回调函数。已经有一个很好的答案如何做到这一点 – ggzone

因为对话框是异步的，你可以使用一个延迟的方法：

window.confirm = function (message_confirm) { 
 
    var defer = $.Deferred(); 
 
    $('<div/>', {title: 'Please confirm', 'class': 'confirm', 'id': 'dialogconfirm', text: message_confirm}) 
 
    .dialog({ 
 
    buttons: { 
 
     YES: function() { 
 
     defer.resolve("yes"); 
 
     $(this).attr('yesno', true); 
 
     $(this).dialog('close'); 
 
     }, NO: function() { 
 
     defer.resolve("no"); 
 
     $(this).attr('yesno', false); 
 
     $(this).dialog('close'); 
 
     } 
 
    }, 
 
    close: function() { 
 
     if ($(this).attr('yesno') === undefined) { 
 
      defer.resolve("no"); 
 
     } 
 
     $(this).remove(); 
 
    }, 
 
    draggable: true, 
 
    modal: true, 
 
    resizable: false, 
 
    width: 'auto', 
 
    hide: {effect: "fade", duration: 300} 
 
    }); 
 
    return defer.promise(); 
 
}; 
 

 
$(function() { 
 
    confirm("Are you sure you want to delete this user?").then(function(yesno) { 
 
    console.log(yesno); 
 
    }); 
 
});

<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

来源

2016-08-02 14:33:11 gaetanoM

执行操作后，此工作并关闭对话框。我在检查'yesno'后执行了这个操作。非常感谢。 – ITWorker

@ITWorker代码片段更新：我添加了$（this）.attr（'yesno'，true）;或者错误，我会在测试之前关闭对话框。这样，如果您在任何情况下都使用ESC或X关闭对话框，则会执行解析延迟操作，然后执行该部分。 – gaetanoM

完美的谢谢。 – ITWorker

你可以回调参数添加到功能

window.confirm = function (message_confirm, ok_callback)

火它是

buttons: { YES: function() { ok_callback(); }}

，后来再这样下去

confirm("message", function(){ 
    alert('smth'); 
});

来源

2016-08-02 14:23:44

这工作，但对话框仍然留在那里后，我点击是和行动执行。谢谢您的帮助。 – ITWorker

尝试类似下面。它为我工作。

<script> 
    $(function() { 
    $("#dialog-confirm").dialog({ 
     resizable: false, 
     height: "auto", 
     width: 400, 
     modal: true, 
     buttons: { 
     "Delete user": function() { 
      alert("test"); 
     }, 
     Cancel: function() { 
      $(this).dialog("close"); 
     } 
     } 
    }); 
    }); 
    </script> 
</head> 
<body> 

<div id="dialog-confirm" title="Please confirm"> 
    <p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>Are you sure you want to delete this user?</p> 
</div>

来源

2016-08-02 14:31:05 spm

我没有尝试过，但感谢回复。我试图让它可以在整个应用程序中被替换，并且这将允许我使用不同的行为来进行是的，而不是每次都在对话框中定义它。 – ITWorker

jQueryUI对话框替换确认？

回答

相关问题