作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个多步骤表单,上面有一个多步骤进度条。对于多步骤表单,我使用带有“step1/2/3/4”作为 id 的选项卡 Pane 。当我在第一部分向下滚动时,我想单击“下一部分”按钮。单击按钮后,它会将我带到下一部分,但在我向下滚动以单击按钮时的同一点。我想做的是当通过单击按钮更改部分时将我带到页面顶部。我尝试将此方法添加到我的 javascript 代码中,但它不起作用:
$(document).ready(function(){
$(this).scrollTop(0);
});
如有任何帮助,我们将不胜感激!谢谢!
这是我的 JS 代码:
$(document).ready(function () {
//Initialize tooltips
$('.nav-tabs > li a[title]').tooltip();
// METHOD FOR THE PROGRESS BAR
$('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
var $target = $(e.target);
if ($target.parent().hasClass('disabled')) {
return false;
}
});
// NEXT STEP METHOD - WHEN BUTTON CLICKED TAKES TO THE NEXT SECTION
$(".next-step").click(function (e) {
var $active = $('.progressbar .nav-tabs li.active');
$active.next().removeClass('disabled');
nextTab($active);
});
// PREVIOUS STEP METHOD - WHEN BUTTON CLICKED TAKES TO THE PREVIOUS SECTION
$(".prev-step").click(function (e) {
var $active = $('.progressbar .nav-tabs li.active');
prevTab($active);
});
});
这是选项卡 Pane 底部的按钮:
<button type="button" name="next" class="next proceed-to-payment next-step" value="Proceed to Payment">Proceed to Payment</button>
<button type="button" name="previous" class="previous back-to-cart prev-step" value="Back" id="back-to-cart-id">Back</button>
最佳答案
将 $(document).scrollTop(0)
或 window.scrollTo(0, 0);
添加到 $(".next-step").click
和 $(".prev-step").click
函数
关于javascript - 单击按钮且页面更改时滚动回首页,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53265042/
我是一名优秀的程序员,十分优秀!