带有 Jqueryui 的确认消息始终返回 true

Confirmation message with Jqueryui always return true

本文关键字:返回 true 消息 Jqueryui 确认 带有      更新时间:2023-09-26

我写了一个名为confirmMessage(msg)的函数来处理链接的onclick事件:

<a href="delete.php?id=12" onclick="return confirmMessage('Are You REALLY Sure?')">Delete</a>

函数的代码是:

<script>
    function confirmMessage(msg){
    p = true
    elementHtml = '<div id="ConfirmMessage">'+msg+'</div>';
    $("body").append(elementHtml);
    $("#ConfirmMessage").dialog({
      resizable: false,
      height:140,
      modal: true,
      buttons: {
        "Delete": function() {
        p = true;           
          $( this ).dialog( "close" );
        },
        Cancel: function() {
        p = false;
          $( this ).dialog( "close" );
        }
      }
    }
    );
    return p;
}
    </script>

在上面的函数中,我将变量p设置为大小写容器,即 true 或 false,最初我将其设置为 true。此外,消息元素是动态创建的。但是,当我单击删除链接时,它不会等到我决定删除或取消并删除。

当我最初将p设置为 false 时,无论决定如何关闭对话框,它都不会执行任何其他操作。

这段代码的错误在哪里?!

jQuery 对话框异步 - 它不会阻塞。 该函数将继续并返回,而无需等待响应。 您将需要使用以下代码:

function confirmMessage(msg,goto){
    elementHtml = '<div id="ConfirmMessage">'+msg+'</div>';
    $("body").append(elementHtml);
    $("#ConfirmMessage").dialog({
        resizable: false,
        height:140,
        modal: true,
        buttons: {
            "Delete": function() {   
                 $( this ).dialog( "close" );
                 window.location.href=goto;
             },
             Cancel: function() {
                 $( this ).dialog( "close" );
             },
         },
     });
    return false;
}

和:

<a href="delete.php?id=12" onclick="return confirmMessage('Are You REALLY Sure?',this.href)">Delete</a>

改变所以回报并不是真正决定会发生什么。

请参阅此 JSFiddle。

您的错误在于认为该函数在返回之前会等待您单击其中一个按钮。 .dialog()将显示对话框并立即返回。响应用户交互必须在回调函数中完成。

使用 close: 处理程序在对话框关闭时运行代码:

$("#ConfirmMessage").dialog({
  resizable: false,
  height:140,
  modal: true,
  close: function() {
    if (p) {
        ...
    } else {
        ...
    }
  },
  buttons: {
    "Delete": function() {
    p = true;           
      $( this ).dialog( "close" );
    },
    Cancel: function() {
    p = false;
      $( this ).dialog( "close" );
    }
  }
}
);

"return p"甚至在您能够看到模态窗口之前就被执行了。 对话方法是异步执行的