Question

由于jquery UI对话框不支持返回true / false，我需要一些其他方法来替换javascript确认。

它必须返回true / false，以便我的javascript中的验证过程将运行：

 var where_to_coupon = confirm(pm_info_msg_013);
if (where_to_coupon== true) {
doSubmit=true;
 return doSubmit;

Answer 1

我知道这样做的唯一方法是将回调传递给函数您遇到的问题是JQuery UI不会阻止执行，如确认等待用户输入，因此您需要打开对话框并在用户点击应答行为时相应。

如果使用Jquery UI对话框，则可以将回调函数绑定到按钮。

例如：

myConfirm("Are you sure?", function(){ [YES CODE] }, function(){ [NO CODE] });

您的自定义确认将如下所示：

var myConfirm = function(msg, yesAction, noAction){
  $.dialog{
     [CODE],
     buttons: {
            yes: yeasAction,
            no: noAction
            }
     };
};

Answer 2

jQuery UI可以执行您想要的操作，您只需调整代码即可以异步方式工作。 Ariel Popovosky给出了一个答案，试图将一个对话框调用包装成一个简单的函数调用，并且运行良好，但需要进行相同的基本同步/异步代码修改，以免window.confirm所需的任何更改。

使用window.confirm我们使用同步方式 - 在用户做出决定时程序暂停。请参阅示例：http://jsfiddle.net/9jY7E/

使用UI的对话框，我们只需将确认时发生的行为移动到分配给其中一个UI按钮的行为中。对话框显示，程序继续运行。但是因为您将“ok”代码移动到绑定到按钮的功能中，所以在用户单击它之前该代码才会运行。以下链接与我在window.confirm中显示的示例相同，但已修改为使用UI对话框：http://jsfiddle.net/9jY7E/1/

我不知道window.confirm的任何替换是否与window.confirm一样，但允许您自己的样式。我所知道的所有对话系统都与UI有些相似。

其他：在以下链接中，您将找到使用Ariel在其答案中提供的方法的相同外部链接确认的第3个示例：http://jsfiddle.net/9jY7E/2/

Answer 3

这有点令人费解，但它对我有用。它设置一个“全局”变量并测试该值以查看是否应该显示该对话框。

我知道这可能不是最有效的方法。

confirmIt功能返回true或false。

setTimeout("confirmItConfirmed=false;",500);接近结尾的原因是重置变量，以便下次调用该函数时，它不会返回true。

有些浏览器在处理自动高度和宽度方面比其他浏览器做得更好。

通知功能是警报的替代品， confirmIt 取代确认。

<html>
 <head>
  <title>jQuery Confirm &amp; Alert Replacements</title>
  <link type=text/css href=http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/redmond/jquery-ui.css rel=stylesheet />
  <script type=text/javascript src=https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js></script>
  <script type=text/javascript src=https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js></script>
  <script type=text/javascript>
   var confirmItConfirmed = false;
   var jq = $.noConflict();
   function notice(message,title,height,width) {
    if (!title)
     var title = document.title+' says...';
    jq('body').append('<span id=noticeDialogSpan style=display:none></span>');
    jq('#noticeDialogSpan').html('<div id=noticeDialog title="'+title+'">'+message+'</div>');
    if (!width)
     var width = jq('#noticeDialogSpan').width()+40;
    if (!height)
     if (jq('#noticeDialogSpan').height() > jq(window).height()-100)
      var height = jq(window).height()-100;
     else
      var height = 'auto';
    jq('#navMenu').hide();
    jq('#noticeDialog').dialog ({
     height: height,
     width: width,
     modal: true,
     close: function(event,ui) {
      jq(this).dialog('destroy');
      jq('#noticeDialog').remove();
      jq('#noticeDialogSpan').remove();
      jq('#navMenu').show();
     },
     buttons: {
      'Close': function() { jq(this).dialog('close'); }
     }
    });
   }
   function confirmIt(e,message,title,height,width) {
    if (!confirmItConfirmed) {
     if (!title)
      var title = document.title+' says...';
     jq('body').append('<span id=confirmationDialogSpan style=display:none></span>');
     jq('#confirmationDialogSpan').html('<div id=confirmationDialog title="'+title+'">'+message+'</div>');
     if (!width)
      var width = jq('#confirmationDialogSpan').width()+40;
     if (!height)
      if (jq('#confirmationDialogSpan').height() > jq(window).height()-100)
       var height = jq(window).height()-100;
      else
       var height = 'auto';
     jq('#navMenu').hide();
     jq('#confirmationDialog').dialog ({
      height: height,
      width: width,
      modal: true,
      close: function(event,ui) {
       jq('#confirmationDialog').remove();
       jq('#confirmationDialogSpan').remove();
       jq(this).dialog('destroy');
       jq('#navMenu').show();
      },
      buttons: {
       'Confirm': function() {
        jq(this).dialog('close');
        confirmItConfirmed = true;
        e.click();
       },
       'Cancel': function() { jq(this).dialog('close'); }
      }
     });
    }
    setTimeout("confirmItConfirmed=false;",500);
    return confirmItConfirmed;
   }
   function testIt(e) {
    if (confirmIt(e,'Are you sure you want to continue?','My Title'))
     notice('You clicked Confirm','My Title');
   }
  </script>
 </head>
 <body>
  <br />
  <br />
  Click <a href=javascript:void(0) onclick="testIt(this)">HERE</a> to test a link.
  <br />
  <br />
  Click this button to test it too <input value='Click Me' type=button onclick="testIt(this)" />
 </body>
</html>

Answer 4

这也可以使用boopup + callbacks来完成：

Boopup.confirm("This is a boopup confirm!", function(agree) {
    console.log(agree);
})

https://github.com/petruisfan/boopup

javascript使用return true / false确认替换

4 个答案: