Question

我希望扩展一些JQuery代码，以便在我点击它后替换它。我有这个：

var minimiseContent = function(e)
{
    var targetContent = $('div.itemContent', this.parentNode.parentNode);
    if (targetContent.css('display') == 'none') {
        targetContent.slideDown(300);
        var minIcon = $('minimise', this.parentNode.parentNode);
        $(minIcon).attr("src", "../IMG/btnMinimise.png");

    } else {
    targetContent.slideUp(300);
        var minIcon = $('minimise', this.parentNode.parentNode);
        $(minIcon).attr("src", "../IMG/btnMaximise.png");

    }
    return false;
};

从此调用：

$（'a.minimise'）。bind（'click'，minimiseContent）;

并如此声明：

<a href="#" class="minimise"><img src="../IMG/btnMinimise.png" class="minimise" /></a>

基本上，编码第一部分中的两行应该处理它，即

var minIcon = $('minimise', this.parentNode.parentNode);
            $(minIcon).attr("src", "../IMG/btnMinimise.png");

和

        var minIcon = $('minimise', this.parentNode.parentNode);
        $(minIcon).attr("src", "../IMG/btnMaximise.png");

但我不知道为什么图像没有被替换。 minimize是css文件中的一个类。其余的编码工作。

我尝试用$（this），$（img.minimise）替换$（minIcon），但都没有用。有谁知道任何解决方案？

Answer 1

我的第一印象是你要替换它：

var minIcon = $('minimise', this.parentNode.parentNode);

有了这个：

var minIcon = $('img.minimise', this.parentNode.parentNode);

Answer 2

您不需要<a>标记。 img标签也可以有一个点击事件。

另外，我认为这是toggle函数的一个很好的用例：

$("img.minimise").toggle(
  function () {
    $(this).attr("src", "../IMG/btnMinimise.png")
  },
  function () {
    $(this).attr("src", "../IMG/btnMaximise.png");
  }
);

每次点击都会调用函数调用。

JQuery替换图像问题

2 个答案: