时间戳

首页 > 解决方案 > 触发按钮单击事件时，滚动条移动到顶部。我想在特定位置停止滚动条移动

javascript - 触发按钮单击事件时，滚动条移动到顶部。我想在特定位置停止滚动条移动

问题描述

实际上，我通过单击按钮在数据库中的表中显示数据。我有多个按钮和多个表格。我想根据按钮单击将滚动条移动到特定的 div。每次当我单击任何按钮时，滚动条都会移到顶部。这是我用来在特定位置移动滚动条的代码。

<input type="submit"  name="search"  id ="search" onclick="myFunctionq();" value="Display" /> 
<script>
function myFunctionq(){
    var divLoc = $('#div1').offset();
    $('html, body').animate({scrollTop: divLoc.top},"slow");
    };
</script>

这对我不起作用。

如果我在 $(document).ready(function()) 中编写相同的代码，它正在工作并且每次滚动条都在移动。

<script type="text/javascript">
   $(document).ready(function(){
       var divLoc = $('#div1').offset();
       $('html, body').animate({scrollTop: divLoc.top}, "slow");

  });
</script>

我想根据按钮单击事件将滚动位置移动到 div。

标签： javascriptjquery

解决方案

当您单击按钮时，它会调用您的函数并调用事件提交，并且您的页面会刷新。您需要添加到 onclick return false 或 e.preventDefault，以禁用默认事件

<input type="submit"  name="search"  id ="search" onclick="return myFunctionq();" value="Display" /> 
<script>
function myFunctionq(){
    var divLoc = $('#div1').offset();
    $('html, body').animate({scrollTop: divLoc.top},"slow");
    return false
    };
</script>
<?php if isset($_POST['search']):?> <script>myFunctionq()</script> <?php endif;?>

推荐阅读