如何檢查是否已單擊鏈接然后關閉模式

Question

我有一個 function 打開一個模式並根據以下條件在該對話框中顯示錯誤消息

  Error: function (ex, context) {
       
        var current = $(".Capture[dataid=" + context + "]");
          current.addClass('error');
       if(ex)
       var link='http://localhost/test'
        current.append(`<div class="error">please click on the link <a href = "${link}">Details</a></div>`);

    },

如您所見，我添加了要在對話框上顯示的鏈接，但是我如何確定用戶何時單擊該鏈接？ 然后我希望它調用一個按鈕點擊

<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix"><div class="ui-dialog-buttonset"><button type="button">Close</button></div></div>

這樣它最終會調用對話框關閉選項

 $(dialog).dialog({
                    modal: true,
                    closeOnEscape: false,
                    dialogClass: "noClose",
                    height: $(window).height() * 0.8,
                    buttons: {
                        "Close": function () {
                            $(this).dialog("close");
                        }
                    },
                    close: function (event) {
                       //does something in here
                       
                    },
                   
                });

所以基本上當點擊鏈接時，它會將您重定向到該頁面並為您關閉對話框。

Answer 1

您可以a標簽上編寫點擊事件，因此每當點擊此標簽時，獲取標簽a href ，然后使用.trigger('click')觸發關閉按鈕上的點擊事件，最后重定向到所需頁面。

演示代碼：

 $("#dialog").dialog({ modal: true, closeOnEscape: false, dialogClass: "noClose", height: $(window).height() * 0.8, buttons: { "Close": function() { $(this).dialog("close"); console.log(" I am in") } }, close: function(event) { //does something in here }, }); //on click of a tag $(document).on("click", ".error a", function(e) { e.preventDefault(); var href = $(this).attr("href") //get href $(".ui-dialog-buttonset button").trigger('click'); //trigger click event on close button window.location.href = href; })

 <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <link rel="stylesheet" href="/resources/demos/style.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> Here is dialog. <div id="dialog" title="Basic dialog"> <div class="error">please click on the link <a href="google.com">Details</a> </div> </div>

Answer 2

如果我正確地得到了你想要的 - 試試這個：

$('a').on('click', (e) => 
   { 
      e.preventDefault();
      $('button')[0].click();
   });