如何获取每个链接的哈希值?

时间:2016-10-12 14:58:50

标签: javascript jquery

我试图在每个部分滚动时编写一个活动的链接状态。

我试图获取链接的哈希值。

我目前的代码是针对此行' console.log($(this).eq(i).hash);'正在回归' undefined'。

由于

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Scroll</title>
        <style media="screen">
            body, html {
                padding: 0;
                margin: 0;
            }
            section {
                padding: 6rem;
                text-align: center;
            }
            section:nth-child(1) {
                background: orangered;
            }
            section:nth-child(2) {
                background: steelblue;
            }
            section:nth-child(3) {
                background: orange;
            }
            section:nth-child(4) {
                background: purple;
            }
            section:nth-child(5) {
                background: red;
            }
            section:nth-child(6) {
                background: black;
                color: #fff;
            }

            nav {
                background: black;
                color: #fff;
                padding: 2rem 0;
                text-align: center;
                position: fixed;
                top: 0;
                width: 100%;
            }

            ul {
                display: inline-block;
            }

            ul > li {
                display: inline-block;
                padding-right: 5px;
            }

            .active {
                background: grey!important;
            }
        </style>
    </head>
    <body>
        <nav>
            <ul>
                <a href="#section1">Section 1</a>
                <a href="#section2">Section 2</a>
                <a href="#section3">Section 3</a>
                <a href="#section4">Section 4</a>
                <a href="#section5">Section 5</a>
                <a href="#section6">Section 6</a>
            </ul>
        </nav>
        <section>
            <h2 id="section1">Section 1</h2>
        </section>
        <section>
            <h2 id="section2">Section 2</h2>
        </section>
        <section>
            <h2 id="section3">Section 3</h2>
        </section>
        <section>
            <h2 id="section4">Section 4</h2>
        </section>
        <section>
            <h2 id="section5">Section 5</h2>
        </section>
        <section>
            <h2 id="section6">Section 6</h2>
        </section>
        <script src="https://code.jquery.com/jquery-2.2.4.min.js"   integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
        <script type="text/javascript">
        $("a[href^='#']").each(function(i){
            console.log($(this).eq(i).hash);
        });
            $(window).scroll(function(){
                $("section").each(function(i){
                    if( $(document).scrollTop() >= $("section").eq(i).offset().top) {
                        $("section").eq(i).addClass("active");
                    } else {
                        $("section").eq(i).removeClass("active");
                    }
                });
            });
        </script>
    </body>
</html>

1 个答案:

答案 0 :(得分:2)

jquery对象没有hash属性,底层的dom元素没有

而不是

$(this).eq(i).hash

尝试

this.hash