為什么我的彈出確認免責聲明框事件偵聽器沒有附加到元素？

Question

當您離開我的 php 站點時，我一直試圖為免責聲明制作一個彈出式確認框。 我一直在為為什么代碼現在不能工作一個多星期而苦苦掙扎，最后我決定看看是否有人可以幫助解決我的問題

到目前為止，為了測試代碼，我制作了一個測試頁面來確定代碼是否有效，並且我在測試頁面上成功測試了代碼。 當我將正確的腳本和樣式表鏈接到我的 php 站點時，代碼不起作用。 我使用檢查器查看是否可以發現問題，但是腳本的單擊事件偵聽器沒有顯示在偵聽器應該位於的任何元素上。

每當你點擊一個鏈接時， $('a').click(function ()這將調用Confirm函數，該函數反過來應該打開確認框，但這個事件偵聽器甚至沒有顯示在檢查器中。代碼之前括號中存在 ESLint 錯誤，但是一旦我添加/* eslint-env browser */ /* global $ */錯誤停止發生。我已經到了我的行尾，為什么這可能會發生。

/* eslint-env browser */ 
/* global $ */
function Confirm(title, msg, $true, $false, $link) { /*change*/
    var $content =  "<div class='dialog-ovelay'>" +
                        "<div class='dialog'><header>" +
                         " <h3> " + title + " </h3> " +
                         "<i class='fa fa-close'></i>" +
                     "</header>" +
                     "<div class='dialog-msg'>" +
                         " <p> " + msg + " </p> " +
                     "</div>" +
                     "<footer>" +
                         "<div class='controls'>" +
                             " <button class='button button-danger doAction'>" + $true + "</button> " +
                             " <button class='button button-default cancelAction'>" + $false + "</button> " +
                         "</div>" +
                     "</footer>" +
                "</div>" +
            "</div>";
    $('body').prepend($content);

    $('.doAction').click(function () {
        window.open($link, "_blank"); /*new*/
        $(this).parents('.dialog-ovelay').fadeOut(500, function () {
            $(this).remove();
        });
    });

    $('.cancelAction, .fa-close').click(function () {
        $(this).parents('.dialog-ovelay').fadeOut(500, function () {
            $(this).remove();
        });
    });     
}

$('a').click(function () {
    Confirm('Go to Google', 'Are you sure you want to visit Google', 'Yes', 'Cancel', "https://www.google.com.eg"); /*change*/
});

.dialog-ovelay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.50);
    z-index: 999999
}
.dialog-ovelay .dialog {
    width: 400px;
    margin: 100px auto 0;
    background-color: #fff;
    box-shadow: 0 0 20px rgba(0,0,0,.2);
    border-radius: 3px;
    overflow: hidden
}
.dialog-ovelay .dialog header {
    padding: 10px 8px;
    background-color: #f6f7f9;
    border-bottom: 1px solid #e5e5e5
}
.dialog-ovelay .dialog header h3 {
    font-size: 14px;
    margin: 0;
    color: #555;
    display: inline-block
}
.dialog-ovelay .dialog header .fa-close {
    float: right;
    color: #c4c5c7;
    cursor: pointer;
    transition: all .5s ease;
    padding: 0 2px;
    border-radius: 1px    
}
.dialog-ovelay .dialog header .fa-close:hover {
    color: #b9b9b9
}
.dialog-ovelay .dialog header .fa-close:active {
    box-shadow: 0 0 5px #673AB7;
    color: #a2a2a2
}
.dialog-ovelay .dialog .dialog-msg {
    padding: 12px 10px
}
.dialog-ovelay .dialog .dialog-msg p{
    margin: 0;
    font-size: 15px;
    color: #333
}
.dialog-ovelay .dialog footer {
    border-top: 1px solid #e5e5e5;
    padding: 8px 10px
}
.dialog-ovelay .dialog footer .controls {
    direction: rtl
}
.dialog-ovelay .dialog footer .controls .button {
    padding: 5px 15px;
    border-radius: 3px
}
.button {
  cursor: pointer
}
.button-default {
    background-color: rgb(248, 248, 248);
    border: 1px solid rgba(204, 204, 204, 0.5);
    color: #5D5D5D;
}
.button-danger {
    background-color: #f44336;
    border: 1px solid #d32f2f;
    color: #f5f5f5
}
.link {
  padding: 5px 10px;
  cursor: pointer
}

Answer 1

你好你需要使用確認作為布爾值即

var userInput = Confirm('Go to Google', 'Are you sure you want to visit Google', 'Yes', 'Cancel');
if(userInput) {
    window.open("https://www.google.com.eg");
}

試試吧，讓我知道。