4

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

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

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

4 回答 4

2

我知道这样做的唯一方法是将回调传递给函数。
您面临的问题是 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
            }
     };
};
于 2011-08-10T19:36:39.700 回答
1

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 在他的回答中给出的方法找到相同外部链接确认的第三个示例：http: //jsfiddle.net/9jY7E/2/

于 2011-08-11T00:21:14.460 回答
1

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

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

confirmIt 函数返回真或假。

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

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

通知功能是alert的替代品，confirmIt替代confirm。

<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>
于 2012-05-05T04:49:00.383 回答
-1

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

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

https://github.com/petruisfan/boopup

于 2016-02-17T07:44:40.777 回答