Question

我对javascript / jquery有点新鲜。我试图制作一个在悬停时从200x200图像切换到400x400图像的功能。幸运的是，所有200x200图像都以.200.200.jpg结束，所有400x400 .400.400.jpg都是相同的文件路径。

这是我的javascript（我切换悬停触发测试）

    $('.Content .ProductList li').trigger(function(){
        var ImageSRC = this.find(".productimage a img").attr('src');
        NewImageSRC = ImageSRC.replace('.200.200.jpg','.400.400.jpg');
        this.find(".productimage a img").attr('src', NewImageSRC)
    });

这是我在控制台上遇到的错误：

TypeError: Object function (){ var ImageSRC = this.find(".productimage a img").attr('src'); NewImageSRC = ImageSRC.replace('.200.200.jpg','.400.400.jpg'); this.find(".productimage a img").attr('src', NewImageSRC) } has no method 'indexOf'

此处供参考的是我试图获取的HTML的缩写版本：

<div class="content">
    <ul class="ProductList =">
        <li>
            <div class="ProductImage">
                <a href="#">
                    <img src="../../...200.200.jpg" />
                </a>
            </div>
        </li>
        ...
    </ul>
</div>

Answer 1

保留hover，并使用

$(this).find

而不是

this.find

Answer 2

你能做一个悬停事件，并通过ID调整CSS吗？

$( ".img200pxclass" ).hover(function() {
  $(this).attr('src','400px.png');
  $(this).switchClass( "img200px", "img400px");
  $(this).css("height", "400px"); //same for width ; except, updating class might do this for you if you want 
});

我认为这样的东西可以起作用，如果你可以搞乱类属性

jquery函数的类型错误

2 个答案: