0
セクションごとのスクロールでアクティブなリンク状態をコーディングしようとしています。各リンクのハッシュを取得するにはどうすればよいですか？
私はリンクのハッシュを取得しようとしています。
現在のコードは、この行の '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>
てみてください 'てみませんこのハッシュ '。 –