Question

我有html代码，因此显示图像：

<p class="word_set">2<span class="color_up audio" id="b1e02">and</span><span class="color_up  audio" id="b1t02">และ</span><span class="ws_dialog_icon"><img src="/templates/beez_20/images/e2tw/lamp_non-hover_20.png" alt="light bulb" height="20px" width="20px"></span></p>

我希望图像在鼠标悬停时改变，所以在这个jquery代码中，悬停适用于第一个文本hi-lighting语句，没问题，但是在第二个悬停语句中，图像不会随着鼠标悬停而改变：

jQuery.noConflict();
jQuery(document).ready(function () {
    jQuery("span.color_up").hover(

    function () {
        jQuery(this).css({
            "color": "red"
        });
    },

    function () {
        jQuery(this).css({
            "color": "black"
        });
    });
    jQuery("span.ws_dialog_icon").hover(

    function () {
        jQuery(this).attr("src", "/templates/beez_20/images/e2tw/lamp_hover_20.png");
        alert("hover");
    },

    function () {
        jQuery(this).attr("src", "/templates/beez_20/images/e2tw/lamp_non-hover_20.png");
    });
});

警报显示正在访问第二个悬停语句。此外，当替换非悬停图像时，lamp_hover_20.png将显示在html中。我不明白这里有什么问题，这可能很明显。任何帮助，非常感谢，肯定。

Answer 1

您尝试更改src的{{1}}，您需要在span

内搜索

改变这个：

img

到此：

jQuery("span.ws_dialog_icon").hover(
        function() {
          jQuery(this).attr("src","/templates/beez_20/images/e2tw/lamp_hover_20.png");
          alert("hover");
        },
        function() {
          jQuery(this).attr("src","/templates/beez_20/images/e2tw/lamp_non-hover_20.png");
        }
      );

Answer 2

我认为jQuery（this）将引用jQuery中的span而不是img（“span.ws_dialog_icon”）。

尝试

jQuery(this).find('img').attr(..

html显示图像，jQuery没有

2 个答案: