按钮单击后不需要的滚动

Question

我不确定要在此处发布什么代码，因为我不知道是什么原因导致此页面的代码很长，但仍然没有实时版本。

基本上它是一个带有几个面板的表单，只有1个可见，当您单击下一步时，用户将移动到下一个屏幕。会发生什么事情，当你点击下一步有一个不需要的滚动到页脚，任何想法可能导致这个？查看下面的gif：

编辑：这是按钮代码： <a href="#" class="btn btn-warning btn-next tuc">Next</a>

和jQuery：

$('.btn-next').on('click', function(e){
        if (!$("[name='amount_tobe_charged']").val()) {
          alert('Please fill in amount');
           } else if($("[name='amount_tobe_charged']").val() < 1) {
               alert('Please enter amount');
           } else {
        var tab = $(this).closest('.tab-pane');
        var nxt = $(tab).next();
        var empty = $(tab).find('.required').filter(function(){
          if($(this).attr('type') === 'email'){
            return this.value.indexOf('@') < 0;
          } else {
            return $.trim(this.value) === '';
          }
        });
        var error = $(empty[0]).attr('data-error') || 'Please fill in all fields';

        if(nxt.attr('id') === 'finish-tab'){
          submitForm(tab, nxt);
        } else {
          if(!empty.length) {
            changeTab(tab, nxt);
          } else {
            alert(error);
          }
        }
      }

Answer 1

你可以在你的gif中看到它发生。这是因为您隐藏了表单之前的列，因此一旦该列不存在。它会让你失望。你可以添加一个滚动来解决jQuery（或者vanilla）的问题，但我只提供jQuery＆＃39;平滑滚动）。执行以下操作并删除导致其移位的{ "error":{ "root_cause":[ { "type":"mapper_parsing_exception", "reason":"Root mapping definition has unsupported parameters: [mappings : {order={properties={order_no={type=string}, order_products={type=nested, properties={order_product_no={type=int}, order_product_options={type=nested, properties={order_product_option_no={type=int}}}}}}}}]" } ], "type":"mapper_parsing_exception", "reason":"Root mapping definition has unsupported parameters: [mappings : {order={properties={order_no={type=string}, order_products={type=nested, properties={order_product_no={type=int}, order_product_options={type=nested, properties={order_product_option_no={type=int}}}}}}}}]" }, "status":400 } 。

style="display: none;"

您希望在您的JS代码中隐藏该列之后放置此内容。