Javascript 使用Jquery进行图像交换

我对Jquery非常陌生，所以请原谅这个noobie问题。当用户单击相应的超链接时，我试图交换

元素的背景图像。

标记是动态生成的，根据SQL表中设置的图像数量，随时可能有“n”个标记

我的HTML是：

<div id="feature-image">
    <h1><span>A random heading</span></h1>
</div>

<div id="feature-links">
    <a class="a1" href="#">1</a>
    <a class="a2" href="#">2</a>
    <a class="a3" href="#">3</a>
</div>

我所有的图片都被命名为“main_a1.jpg”、“main_a2.jpg”等等

我看不出我做错了什么，也看不出我试图做的事情（在vars中抓取类名等）是否真的是好的实践。。。如果能帮上点忙，我将不胜感激

提前谢谢

编辑：

编辑后的Jquery代码：

$(function(){
    $('#feature-links a').click(function(){
        var image = $(this).attr('class');
        $('#feature-image h1').css('background-image','url(images/main_' + image + '.jpg)');
    });             
});

将行更改为：

var image = $(this).attr("class");

我认为为

.attr（）

函数指定2个参数用于更改属性值。因此，在您的情况下，它会将类更改为

”

---

指定一个参数将返回类的值，更好的方法是设置href，而不是使用类

例如：

$('#feature-links a').click(function(e){

    $('#feature-image h1').css({
        'background-image': 'url(' + $(this).attr('href') + ')'
    });

    e.preventDefault(); // Stops the standard link behaviour

});

然后，您的链接将直接链接到背景图像：

<a href="/path/to/image.jpg">1</a>

---

希望能有所帮助：）

我喜欢这个解决方案，我以前想用它，但发现自己使用的是我“某种程度上”知道如何做的东西。即使这样，我也不能让它工作。。。通过firebug运行它没有发现任何错误，但图像保持不变：（谢谢Curt，我编辑了上面的帖子，以反映我的代码现在的样子。它（不幸的）仍然不起作用。谢谢你帮助我解决问题！发现了我的错误，这是我的CSS嵌套。一切都很好！谢谢！

<a href="/path/to/image.jpg">1</a>