twitter-bootstrap - 单击下一步时停止 Bootstrap 表单向导聚焦

Question

我正在使用 Bootstrap 表单向导，当用户单击继续按钮时，他们将移至下一个选项卡，但页面会向下滚动

我查看了包含脚本的 jquery.bootstrap.wizard 文件，但找不到与焦点或动画有关的任何内容。

如果我删除这段代码，滚动将不会发生，但后退和最终提交按钮会消失

if($settings.onNext && typeof $settings.onNext === 'function' && $settings.onNext($activeTab, $navigation, obj.nextIndex())===false){
    return false;
}

Answer 1

您应该将 scrolltop 脚本添加到 onTabShow 事件中:

<强>1。滚动脚本

$('html, body').animate({
   scrollTop: $("#rootwizard").offset().top
}, 1000);

<强>2。 OntabShow 表单向导事件:

 $('#rootwizard').bootstrapWizard({
                'tabClass': 'nav nav-pills',                
                onTabShow:function(tab,navigation,index){   
                    //Animate scrolltop
                    $('html, body').animate({
                        scrollTop: $("#rootwizard").offset().top
                    }, 1000);
                }
  });