如何在 Jquery UI 对话框中实现确认对话框

我只是不得不解决同样的问题.实现这一点的关键是，对于要使用确认功能的链接，必须在click事件处理程序中对dialog进行部分初始化(如果要将其用于多个链接).这是因为必须将链接的目标URL注入到用于确认按钮单击的事件处理程序中.我使用了一个CSS类来指示哪些链接应该具有确认行为.

Here's my solution, abstracted away to be suitable for an example.

<div id="dialog" title="Confirmation Required">
  Are you sure about this?
</div>

<script type="text/javascript">
  $(document).ready(function() {
    $("#dialog").dialog({
      autoOpen: false,
      modal: true
    });
  });

  $(".confirmLink").click(function(e) {
    e.preventDefault();
    var targetUrl = $(this).attr("href");

    $("#dialog").dialog({
      buttons : {
        "Confirm" : function() {
          window.location.href = targetUrl;
        },
        "Cancel" : function() {
          $(this).dialog("close");
        }
      }
    });

    $("#dialog").dialog("open");
  });
</script>

<a class="confirmLink" href="http://someLinkWhichRequiresConfirmation.com">Click here</a>
<a class="confirmLink" href="http://anotherSensitiveLink">Or, you could click here</a>

I believe that this would work for you, if you can generate your links with the CSS class (confirmLink, in my example).

Here is a jsfiddle with the code in it.

In the interest of full disclosure, I'll note that I spent a few minutes on this particular problem and I provided a similar answer to this question, which was also without an accepted answer at the time.