繁体   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