Wordpress 和 Javascript 鼠标悬停

Question

我正在尝试开发一个插件，当用户单击评论作者的姓名时，该插件会显示网站屏幕截图。 当只有一条评论时，所有内容都有效，但当有多于一条评论时，脚本将不起作用。 我认为问题在于为每个评论调用和发布的变量的名称。 但不知道如何动态改变JS变量的名称以及如何动态调用它。

这是鼠标悬停的代码（在标题中）

    <script type="text/javascript">
function MOver(picimage)
{
Picture_Over = eval(picimage +"On.src")
document[picimage].src = Picture_Over
}
function MOut(picimage)
{
Picture_Out = eval(picimage +"Off.src")
document[picimage].src = Picture_Out
}
-->
</script>

然后这是显示鼠标悬停的代码：

    <script type="text/javascript"><!--

var Img2On = new Image();
Img2On.src = "<?php echo $urlnohttp;?>";
var Img2Off = new Image();
Img2Off.src = "<?php bloginfo('url');?>/wp-content/plugins/[...]/control_play.png";

</script>
<a href="<?php echo $commenturl ?>" onMouseOver="MOver('Img2')" onMouseOut = "MOut('Img2')" ><?php echo $author ?> <img src="<?php bloginfo('url');?>/wp-content/plugins/[...]/control_play.png" border="0" name="Img2"></img></a> 

我认为问题在于“Img2”名称不唯一。

Answer 1

我将大部分评论移至此答案：

要动态调用变量，请将函数更改为如下所示：

function MouseChange( img , imageSrc ) // img will be the tag name, and imageSrc will be the URL of the image
{
    document[img].src = imageSrc;
}

要调用此变量，您将执行以下操作：

<?php $blogPostID = ???;// I don't know how to get blog post ID of the top of my head ?>
<script type="text/javascript"><!--
    var Img<?= $blogPostID ?>On = new Image();
    Img<?= $blogPostID ?>On.src = "<?php echo $urlnohttp;?>";
    var Img<?= $blogPostID ?>Off = new Image();
    Img<?= $blogPostID ?>Off.src = "<?php bloginfo('url');?>/wp-content/plugins/[...]/control_play.png";
// this closes the HTML comment: --></script>

<a href="<?php echo $commenturl ?>" onMouseOver="MouseChange( 'Img<?= $blogPostID ?>' , Img<?= $blogPostID ?>On.src )" onMouseOut = "MouseChange( 'Img<?= $blogPostID ?>' , Img<?= $blogPostID ?>Off.src )" ><?php echo $author ?>
    <img src="<?php bloginfo('url');?>/wp-content/plugins/[...]/control_play.png" border="0" name="Img<?= $blogPostID ?>" />
</a>

所以我所做的是将所有数字替换为博客文章 ID，然后你可以[相对]确定它是唯一的，只要页面的其他部分没有生成名为“Img#”的东西。