jquery - 如何在他们的 click jquery 上交换两个链接

Question

<div class="applications-wrapper">
    <div class="bar" id="onetwo"><a class="fa fa-bars" href="#"></a></div>
    <div class="eye" id="twothree"><a class="fa fa-eye" href="#"></a></div>
</div>

在这里，我想交换具有类 bar 和 eye 的 div，并且在单击链接时，与其相关的内容也应该显示，并且只有在单击时左侧的链接才会导致交换。

Answer 1

使用 removeClass 和 addClass 你可以实现它。请看下面的代码片段

      function ToogleClasses() {
        if ($('#onetwo a').hasClass("fa-bars")) {
            $('#onetwo a').removeClass("fa-bars").addClass("fa-eye");
        }
        else {
            $('#onetwo a').removeClass("fa-eye").addClass("fa-bars");
        }

        if ($('#twothree a').hasClass("fa-bars")) {
            $('#twothree a').removeClass("fa-bars").addClass("fa-eye");
        }
        else {
            $('#twothree a').removeClass("fa-eye").addClass("fa-bars");
        }
    }

    $('#onetwo').click(function () {
        ToogleClasses();
    });

    $('#twothree').click(function () {
        ToogleClasses();
    });

另一种解决方案是

function ToogleClasses() {
    $('#onetwo a').toggleClass("fa-bars fa-eye");
    $('#twothree a').toggleClass("fa-bars fa-eye");
}

因为@OP 希望只有在点击左边的链接时才会发生交换。然后应该注释与 $('#twothree a') 相关的代码