Javascript 返回时Jquery切换不起作用

我使用jquery切换，显示一个图像，然后当用户单击一个元素时，切换到另一个图像，如果他们再次单击，则显示原始图像。就像一种开闭式的东西。当我第一次点击时它就工作了，但之后什么都没有。这是我的jquery

 $(".filterInventory").on("click", function () {

    $(".inventory-search").toggle();
    $(".filer-arrow.down").hide();
    $(".filer-arrow.up").show();

    return false;

});

这是HTML

<div class="container container-padding-top inventory-search-button">
        <div class="row">
            <div class="col-md-12">
                <a href="#" class="filterInventory">Filter <img src="~/Images/icons/down-arrow-white.png" class="filer-arrow down" alt="Filter Arrow" /><img src="~/Images/icons/up-arrow-white.png" class="filer-arrow up" alt="Filter Arrow" /></a>
            </div>
        </div>
    </div>

只是jquery

---

只需jquery

首先隐藏一个图像，然后单击“切换图像”

这种方法怎么样

HTML:

---

最初隐藏一个图像，然后单击“切换图像”

这种方法怎么样

HTML:

---

您可以检查其中一个是否可见，然后通过该选项对其执行操作

$(".filterInventory").on("click", function () {
    if($(".filer-arrow.down").is(":visible")) {
      $(".filer-arrow.down").hide();
      $(".filer-arrow.up").show();
    } else {
      $(".filer-arrow.up").hide();
      $(".filer-arrow.down").show();
    }
});

---

您可以检查其中一个是否可见，然后通过它对它们执行操作

$(".filterInventory").on("click", function () {
    if($(".filer-arrow.down").is(":visible")) {
      $(".filer-arrow.down").hide();
      $(".filer-arrow.up").show();
    } else {
      $(".filer-arrow.up").hide();
      $(".filer-arrow.down").show();
    }
});

---

初始隐藏一个图像

$('img.down').hide();

然后简单地在它们之间切换

$(".filterInventory").click(function () {
    $(".filterInventory img").toggle();
});

---

初始隐藏一个图像

$('img.down').hide();

然后简单地在它们之间切换

$(".filterInventory").click(function () {
    $(".filterInventory img").toggle();
});

---

由于您的一个图像已经隐藏（假设您的css在html中有一个#communities元素），您可以简单地切换它们。与另一个答案中的img元素不同，本答案按类选择所有元素：

$(".filterInventory").on("click", function () {

    $(".filer-arrow.down, .filer-arrow.up, .inventory-search").toggle();
    return false;
});

---

由于您的一个图像已经隐藏（假设您的css在html中有一个#communities元素），您可以简单地切换它们。与另一个答案中的img元素不同，本答案按类选择所有元素：

$(".filterInventory").on("click", function () {

    $(".filer-arrow.down, .filer-arrow.up, .inventory-search").toggle();
    return false;
});

---

为什么要传递两个类？此外，

toggleClass（）

采用类名，而不是选择器，因此您不应该在前面有

。如果您试图切换这两个类，请将其分成两行：

。。。toggleClass（“按下按钮”）。。。切换类别（“按钮启动”）

.button down。button up

应不带句点（“#communities.inventory search button.dropdown toggle”）？使用不带句点的类名。toggleClass（“类名”），一次只能使用一个名称。如果您想在一个表达式中执行此操作，请使用.toggleClass.apply（null，['name1'，'name2']）My bad我发布了错误的代码为什么要传递

toggleClass（）

两个类？此外，

toggleClass（）

采用类名，而不是选择器，因此您不应该在前面有

。如果您试图切换这两个类，请将其分成两行：

。。。toggleClass（“按下按钮”）。。。切换类别（“按钮启动”）

.button down。button up

应不带句点（“#communities.inventory search button.dropdown toggle”）？使用不带句点的类名。toggleClass（“类名”），一次只能使用一个名称。如果您想在一个表达式中执行此操作，请使用.toggleClass.apply（null，['name1'，'name2']）My bad I发布了错误的代码