簡體   English   中英

如何使用javaScript在不同頁面上顯示帶有自定義消息的工具提示?

[英]How can I display a tooltip with custom messages on different pages using javaScript?

我有我編寫的這段代碼,試圖在需要放置工具提示的不同頁面上顯示帶有自定義消息的工具提示。 能否請您看看並幫助我,以便我可以開始工作。

當前代碼中正在發生什么。 我已經測試過它是否通過顯式聲明從對象打印字符串之一

customMessage[0].emailOrCell()

在遍歷customMessage對象數組的for循環內部。 我該如何使其正常工作?

提前致謝。

代碼如下:

var customMessage = [{
    emailOrCell: function (message) {
        if (window.location == url) {
            message = "Please enter the email address or cell phone number associated with your WebsiteName account.";
        }

        return message;

    }
}, {
    forgotPassword: function (message) {
        if (window.location == url) {
            message = "If you have never previously logged in to the app or WebsiteName , your password is your ID number or your passport number.";
        }

        return message;

    }
}];

for (var i = 0; i < customMessage.length; i++) {
    var $tooltip = $("<div class='info-tip'><div class='tool-tip-pin'></div><h2 class='tool-tip-title'>Password</h2><div class='tooltip-text'>" + customMessage[0].emailOrCell() + "</div></div>");
}


$('.info-icon').mouseenter(function () {
    $($tooltip).insertAfter(".info-icon");
}).mouseout(function () {
    if ($($tooltip).is(':visible')) {
        $($tooltip).remove();
    }
});

具有一個對象的數組沒有多大意義。 可以改用普通數組嗎?

var customMessages = [
function emailOrCell(message) {
    if (window.location == url) {
        message = "Please enter the email address or cell phone number associated with your WebsiteName account.";
    }

    return message;

}, 
function forgotPassword (message) {
    if (window.location == url) {
        message = "If you have never previously logged in to the app or WebsiteName , your password is your ID number or your passport number.";
    }

    return message;

}];

現在您可以執行以下操作:

customMessages.forEach(message=>{
 alert(message(" no problem detected!"));
});

除了一些jquery聲明外,我的函數沒有任何問題,因為已經是一個jquery元素,所以不必聲明$($ tooltip)。

 var url='/test'; var customMessage = [{ emailOrCell: function (message) { if (window.location == url) { message = "Please enter the email address or cell phone number associated with your MySchool account."; } return message; } }, { forgotPassword: function (message) { if (window.location == url) { message = "If you have never previously logged in to the MySchool app or website, your password is your ID number or your passport number."; } return message; } }]; for (var i = 0; i < customMessage.length; i++) { var $tooltip = $("<div class='info-tip'><div class='tool-tip-pin'></div><h2 class='tool-tip-title'>Password</h2><div class='tooltip-text'>" + customMessage[0].emailOrCell('custom message') + "</div></div>"); } $('.info-icon').mouseenter(function () { $tooltip.insertAfter(".info-icon"); }).mouseout(function () { if ($tooltip.is(':visible')) { $tooltip.remove(); } }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='info-icon'>info-icon</div> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM