Question

我已成功将div显示/隐藏但现在由于某种原因，除非我在新标签中打开它们，否则页面上的所有其他链接都会停止工作。我怎样才能解决这个问题？

$(document).ready(function () {
    
        $("#div9").show("slow").siblings().hide("slow");
    
        $('a').click(function () {
            event.preventDefault();
            var divname = this.name;
            $("#" + divname).show("slow").siblings().hide("slow");
        });
    
        $('#seeAll').click(function() {
            $('#div2').show("slow")
            $('#div3').show("slow")
            $('#div4').show("slow")
            $('#div5').show("slow")
            $('#div7').show("slow")
            $('#div8').show("slow")
            $('#div9').hide("slow")
        })
    });

    <a class="people-letters" href="#" name="div2">A</a> <a class="people-letters" href="#" name="div3">B</a> <a class="people-letters" href="#" name="div4">C</a> <a class="people-letters" href="#" name="div5">D</a> E F G H I J K L M N O P Q R <a class="people-letters" href="#" name="div7">S</a> T U V <a class="people-letters" href="#" name="div8">W</a> X Y Z  <a id="seeAll" class="people-letters" href="#">See All</a>

    <div>
    <div id="div2" style="display: none;">
    div2
    </div>

    <div id="div3" style="display: none;">
    div3
    </div>

    <div id="div4" style="display: none;">
     div4
     </div>

     <div id="div5" style="display: none;">
     div5
     </div>

     <div id="div7" style="display: none;">
     div7
     </div>

     <div id="div8" style="display: none;">
     div8
     </div>

    <div id="div9" style="display: none;">
     div9
     </div>

     </div>

     <a href="http://google.com/">Sample Link</a>

Answer 1

编辑：

通过将“a”指定为选择器，您已将click事件绑定到所有链接元素。为了将它仅绑定到该特定链接，您可以使用您为隐藏和显示div元素的链接指定的类。

$('a.people-letters').click(function (event) {
    event.preventDefault();
    var divname = this.name;
    $("#" + divname).show("slow").siblings().hide("slow");
});

使用jquery隐藏/显示div时，链接停止工作

1 个答案: