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

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"指定为选择器，您已将单击事件绑定到所有链接元素。为了只将它绑定到特定的链接，您可以使用为隐藏和显示div元素的链接指定的类。

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