Question

我想将div滚动到顶部位置。我有获取href值的问题。现在＆＃39; a＆＃39;在console.log(a);

中返回undefined

＆＃13;

function myFunction()
	   {
	      var a=$(this).attr('href');
		  console.log(a);
		  $('html, body').animate({scrollTop: $('#'+a).offset().top-40}, 500);
 }

＆＃13;

#consulting,#segments,#partner,#insights{min-height:100vh;}
   .secMenu{position:fixed;
   }

＆＃13;

<div class="container-fluid">
	  <div class="row secMenu">
		<div class="col-md-9 col-sm-12 menu">
		 <ul class="nav navMenu">
		 
			  <li class="test1"><a href="#consulting" onclick="myFunction()">Consulting & Solutions</a></li>
			  <li class="test2"><a href="#segments"  onclick="myFunction()">Segments</a></li>
			  <li class="test3"><a href="#partner"  onclick="myFunction()">Our Partners</a></li>
			  <li class="test4"><a href="#insights"  onclick="myFunction()">Perspectives</a></li>
			</ul>  
		</div>
		
	   </div>   <!--End of second menu -->
	    <div class="row">
	   <div id="consulting">
	   div1
		</div>
		<div id="segments">
		div11
		</div>
		<div id="partner">
		div111
		</div>
		<div id="insights">
		 div1111
		</div>
		</div>
	  </div>

＆＃13;

Answer 1

我已经替代了你所使用的东西，但它做了同样的事情。我删除了你使用的函数，而是使用了jQuery。希望我的回答对你有用：

＆＃13;

$('.nav li a').on('click', function(e) {
  e.preventDefault();
  var a = $(this).attr('href');
  $('html, body').animate({
    scrollTop: $(a).offset().top
  }, 500);
});

＆＃13;

#consulting,
#segments,
#partner,
#insights {
  min-height: 100vh;
}
.secMenu {
  position: fixed;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container-fluid">
  <div class="row secMenu">
    <div class="col-md-9 col-sm-12 menu">
      <ul class="nav navMenu">

        <li class="test1"><a href="#consulting">Consulting & Solutions</a>
        </li>
        <li class="test2"><a href="#segments">Segments</a>
        </li>
        <li class="test3"><a href="#partner">Our Partners</a>
        </li>
        <li class="test4"><a href="#insights">Perspectives</a>
        </li>
      </ul>
    </div>

  </div>
  <!--End of second menu -->
  <div class="row">
    <div id="consulting">
      div1
    </div>
    <div id="segments">
      div11
    </div>
    <div id="partner">
      div111
    </div>
    <div id="insights">
      div1111
    </div>
  </div>
</div>

＆＃13;

要查看它的实际效果，您可以点击上面的“运行代码段”按钮，或者可以看到小提琴here。

Answer 2

因为this默认绑定到全局对象（在浏览器中是window）。

您可以尝试将this传递给myFunction()，如下所示：myFunction(this)。在myFunction定义中：function myFunction(target) {...}，target现在引用了锚元素。

使用href id滚动到顶部

2 个答案: