Question

我有一个带有提交按钮的表单（搜索栏）。之后，我希望页面顺利向下滚动到下一部分。我似乎无法找到一个好的工作片段。

我曾尝试使用Jquery .animate，但它不会工作导致页面刷新。

我试图将该部分滚动到表单动作中，但这是即时的，而不是平滑的。

一些解决方案？

＆＃13;

$(".submit").click(function() {
    $('html, body').animate({
        scrollTop: $("#twee").offset().top
    }, 2000);
});

＆＃13;

 	<form action="index.php#twee" method="post">
        <div class="searchbar">
    	<input type="text" name="typeahead" class="typeahead tt-query" autocomplete="off" spellcheck="false" placeholder="Zoek een game">
        </div>
        <div class="submitButton">
    	<input name="submit" type="submit" value="submit" class="submit">
        </div>
		</form>

＆＃13;

Answer 1

您可以在index.php页面中使用此代码

$(document).ready(function(){
    var href = window.location.href; 
    var splitit = (href.split('#'))[1]; //split url to get twee name
    if(splitit !== "" || splitit !== "undefined"){
        $('html, body').animate({
            scrollTop: $('#'+splitit).offset().top
        }, 2000);
    }
});

并从表单提交事件中删除动画

表单提交后向下滚动

1 个答案: