Jquery 切换背景图像位置

我有以下代码，显示/隐藏div，同时根据是否显示div更改文本：

$('#more').click(function() {
    $('#extra').slideToggle('fast');
    $('#more').text(function(_,txt) {
        return txt == 'More about us' ? 'Less about us' : 'More about us';
    });
    return false;
});

在

#more

链接上，我有一个向下的箭头（当div隐藏时，用于“更多关于我们”文本），但我想将此箭头更改为在div可见且文本显示为“更少关于我们”时向上。如何编辑上述代码来执行此操作？

请尝试

$('#more').click(function() {
    $('#extra').slideToggle('fast');
    $('#more').text(function(_,txt) {
        var ret='';

        if ( txt == 'More about us' ) {
           ret = 'Less about us';
           $(this).css('background','url(link/to/image1.png)');
        }else{
           ret = 'More about us';
           $(this).css('background','url(link/to/image2.png)');
        }
        return ret;
    });
    return false;
});

礼貌

---

我认为您可以创建两个css类，然后设置正确的类：

$('#more').removeClass("arrowdown");
$('#more').addClass("arrowup");

---

反之亦然，这取决于您刚才设置的文本。

最后使用了一些在前面的问题上更新的代码：

$('#more').click(function() {
    $('#extra').slideToggle('fast');
    $('#more').text(function(_,txt) {
        var ret='';

        if ( txt == 'More about us' ) {
           ret = 'Less about us';
           $(this).css('background','url(link/to/image1.png)');
        }else{
           ret = 'More about us';
           $(this).css('background','url(link/to/image2.png)');
        }
        return ret;
    });
    return false;
});