2017-05-26 1 views
0

このコードは、ツールチップを配置する必要がある別のページにカスタムメッセージのツールチップを表示するために使用しようとしているものです。あなたはこれを見て、私がそれを働かせるように助けてください。javaScriptを使用して異なるページにカスタムメッセージのツールチップを表示するにはどうすればよいですか?

現在、コードで何が起こっていますか。私はそれが明示的CUSTOMMESSAGEオブジェクト配列をループするループの内側

customMessage[0].emailOrCell() 

を宣言することによって、オブジェクトから文字列のいずれかを印刷するかどうかを確認するためにそれをテストしました。これを正しく動作させるにはどうすればいいですか?

ありがとうございます。

コードは以下の通りです:

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(); 
    } 
}); 
+0

理由だけではなく、一つのオブジェクトの配列??? –

+0

これは単なるサンプルデータでした。私はまだ追加する必要のあるものは含めていません。 – CrisA

答えて

0

つのオブジェクトの配列は、あまり意味がありません。代わりに通常の配列を使用できますか?

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; 

}]; 

今、あなたが行うことができます:私はいくつかのjqueryの宣言を除き、あなたの関数に問題が表示されていない

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

すでにあることから、あなたは$($のツールチップ)を宣言する必要はありませんjqueryの要素...

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>

関連する問題