单击表单上的下一步按钮后禁用 Scrolltop - js

Question

我正在使用来自 Form Assembly 的多页表单。单击下一步按钮转到下一页后，它会滚动到表单顶部并切断页面标题！有什么办法可以阻止这种情况发生吗？

我在表格 html...

中删除了它

<script>

input.wfPageNextButton.onclick=function(){
    $('html, body').animate({ scrollTop: 0 }, 0);
};

</script>

但是没有用。然后我注意到...

<script type="text/javascript" src="http://www.tfaforms.com/wForms/3.8/js/wforms.js"></script>
<script type="text/javascript">
    wFORMS.behaviors.prefill.skip = false;
</script>
    <script type="text/javascript" src="http://www.tfaforms.com/wForms/3.8/js/localization-en_GB.js"></script>

那么，我可以写一些 js 来抵消 this/these js file/s 中发生的事情吗？

我一点也不擅长js，所以很难解释它！

提前感谢您的帮助！

Answer 1

既然你不想一起禁用滚动，我们需要做这样的事情：

$(function() {

    var $body = $(document);
    $body.on('click','.wfPageNextButton, .wfPagePreviousButton', function() {
        // "Disable" the horizontal scroll.
        if ($body.scrollTop() !== 0) {
            $body.scrollTop(0);
        }
    });

});

所以点击按钮后，它会检查它是否有垂直滚动，如果有，则将其设置为 0。至于放在哪里，在你的 body 末尾可能是最安全的。

注意到在您的页面上对其进行测试时，它不熟悉 $ 作为 shorthand 对于 jQuery，因此您可能需要将 $ 更改为 jQuery。

所以

jQuery(function(){
    var $body = jQuery(document);
    ...

单击表单上的下一步按钮后禁用 Scrolltop - js

Disable Scrolltop after clicking next button on form - js

javascript

forms

jquery

scroll

onclick