OnMouseOver / OnMouseOut

Question

我正在使用onMouseOver和onMouseOut功能来改变我的Wordpress网站页脚中一些社交媒体图标的颜色：http://www.retelevise.com。

它工作得很好，但我也在使用Javascript片段来链接到我的电子邮件地址(我在某个地方读到过，这是向垃圾邮件发送者隐藏地址的好方法？)--但是Javascript似乎不喜欢鼠标功能。

<script type="text/javascript">
<!--
var addr1 = "mailto:"
var addr2 = "info"
var addr3 = "@"
var addr4 = "retelevise"
var addr5 = ".com"
document.write('<a href="' + addr1 + addr2 + addr3 + addr4 + addr5 + '">')
document.write('<img src="http://www.retelevise.com/wp-content/themes/myownzee/branding/socialmedia-email-1.png" onmouseover="this.src='http://www.retelevise.com/wp-content/themes/myownzee/branding/socialmedia-email-2.png'" onmouseout="this.src='http://www.retelevise.com/wp-content/themes/myownzee/branding/socialmedia-email-1.png'" class="social-icons-main" title="Email" alt="Email"></a>'); 
//-->
</script>

如果我删除鼠标功能，只有灰色电子邮件图标出现，没有切换到颜色版本悬停，但当我尝试添加鼠标代码，电子邮件图标完全消失。我确实看过一些类似的答案，但很抱歉我没有理解。请问有人有什么想法吗？

谢谢，SN。

Answer 1

单引号在单引号中不能转义。

http://jsbin.com/nakoduqa/1/edit

var addr1 = "mailto:"
var addr2 = "info"
var addr3 = "@"
var addr4 = "retelevise"
var addr5 = ".com"
document.write('<a href="' + addr1 + addr2 + addr3 + addr4 + addr5 + '">')
document.write('<img src="http://www.retelevise.com/wp-content/themes/myownzee/branding/socialmedia-email-1.png" onmouseover="this.src=\'http://www.retelevise.com/wp-content/themes/myownzee/branding/socialmedia-email-2.png\'" onmouseout="this.src=\'http://www.retelevise.com/wp-content/themes/myownzee/branding/socialmedia-email-1.png\'" class="social-icons-main" title="Email" alt="Email"></a>');