Question

是否可以在不使用jQuery滚动的情况下在某个div处启动页面？

现在我正在使用以下代码：

$('html, body').animate({
    scrollTop: $('.here').offset().top
}, 500);

但是，这当然会在页面加载时滚动到该div，我希望它只是将页面直接加载到该div（如果设置了某个Cookie）

Answer 1

您不需要使用18/09/29 10:27:10 ERROR Executor: Exception in task 0.0 in stage 0.0 (TID 0) java.lang.NoSuchMethodError: twitter4j.TwitterStream.addListener(Ltwitter4j/StreamListener;)V at org.apache.spark.streaming.twitter.TwitterReceiver.onStart(TwitterInputDStream.scala:72) at org.apache.spark.streaming.receiver.ReceiverSupervisor.startReceiver(ReceiverSupervisor.scala:149) at org.apache.spark.streaming.receiver.ReceiverSupervisor.start(ReceiverSupervisor.scala:131) at org.apache.spark.streaming.scheduler.ReceiverTracker$ReceiverTrackerEndpoint$$anonfun$9.apply(ReceiverTracker.scala:597) at org.apache.spark.streaming.scheduler.ReceiverTracker$ReceiverTrackerEndpoint$$anonfun$9.apply(ReceiverTracker.scala:587) at org.apache.spark.SparkContext$$anonfun$33.apply(SparkContext.scala:1974) at org.apache.spark.SparkContext$$anonfun$33.apply(SparkContext.scala:1974) at org.apache.spark.scheduler.ResultTask.runTask(ResultTask.scala:70) at org.apache.spark.scheduler.Task.run(Task.scala:85) at org.apache.spark.executor.Executor$TaskRunner.run(Executor.scala:274) at java.util.concurrent.ThreadPoolExecutor.runWorker(Unknown Source) at java.util.concurrent.ThreadPoolExecutor$Worker.run(Unknown Source) at java.lang.Thread.run(Unknown Source) 18/09/29 10:27:10 ERROR SparkUncaughtExceptionHandler: Uncaught exception in thread Thread[Executor task launch worker-0,5,main] java.lang.NoSuchMethodError: twitter4j.TwitterStream.addListener(Ltwitter4j/StreamListener;)V at org.apache.spark.streaming.twitter.TwitterReceiver.onStart(TwitterInputDStream.scala:72) at org.apache.spark.streaming.receiver.ReceiverSupervisor.startReceiver(ReceiverSupervisor.scala:149) at org.apache.spark.streaming.receiver.ReceiverSupervisor.start(ReceiverSupervisor.scala:131) at org.apache.spark.streaming.scheduler.ReceiverTracker$ReceiverTrackerEndpoint$$anonfun$9.apply(ReceiverTracker.scala:597) at org.apache.spark.streaming.scheduler.ReceiverTracker$ReceiverTrackerEndpoint$$anonfun$9.apply(ReceiverTracker.scala:587) at org.apache.spark.SparkContext$$anonfun$33.apply(SparkContext.scala:1974) at org.apache.spark.SparkContext$$anonfun$33.apply(SparkContext.scala:1974) at org.apache.spark.scheduler.ResultTask.runTask(ResultTask.scala:70) at org.apache.spark.scheduler.Task.run(Task.scala:85) at org.apache.spark.executor.Executor$TaskRunner.run(Executor.scala:274) at java.util.concurrent.ThreadPoolExecutor.runWorker(Unknown Source) at java.util.concurrent.ThreadPoolExecutor$Worker.run(Unknown Source) at java.lang.Thread.run(Unknown Source) 18/09/29 10:27:10 ERROR TaskSetManager: Task 0 in stage 0.0 failed 1 times; aborting job 18/09/29 10:27:10 ERROR ReceiverTracker: Deregistered receiver for stream 0: Stopped by driver ------------------------------------------- Time: 1538242030000 ms ------------------------------------------- ------------------------------------------- Time: 1538242030000 ms -------------------------------------------来更改滚动位置。只需animate。

或者可能更简单，只需给所需的元素指定一个ID，然后将$('html, body').scrollTop($('.here').offset().top)设置为该ID。

Answer 2

“ 如果设置了某些cookie ”

如果您使用任何服务器端脚本语言来获取/设置该cookie，也可以将ID作为哈希值附加到div上，以使其跳转到该div。

例如，如果我的页面是

Queue

，URL为 http://www.myawesomewebsite.com/page#jumphere ，那么在大多数浏览器中，您的页面在加载后将跳至该点。

Answer 3

页面加载时可以运行此javascript。使用指定的id将带您到指定的div。看看下面的代码段：

let boxTop = $("#orange-div").offset().top;
window.scrollTo(0, boxTop);

.padding-div {
  height: 200vh;
  width: 200px;
  background-color: red;
}

.box {
  height: 100px;
  width: 200px;
  background-color: orange;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="padding-div">

</div>

<div id="orange-div" class="box">

</div>

<div class="padding-div">

</div>

Answer 4

您可以使用window.scrollTo()：

const target = $('.here').offset().top;

window.scrollTo({
    top: target,
    behavior: 'instant'
});

.block {
  height: 49vh;
  background: red;
  margin-bottom: 1vh;
}

.here {
  background: blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="block"></div>
<div class="block"></div>
<div class="block here"></div>
<div class="block"></div>

某些div上的jQuery起始页而不滚动

4 个答案: