我有一个按钮,单击该按钮时,会将默认的 2 列网格更改为单列网格。在此单击事件之后,列中包含元素的 Y 偏移位置会发生变化。
我需要知道更新的 Y 偏移位置,以便能够在列网格更改后立即 scrollTop
到某个元素,但我似乎无法使代码正常工作,并且不确定我的是否可以结构是保持它们同步的正确重构方式。
var lastTrigger;
var target = $('#' + lastTrigger);
$('button').click(function () {
$('.row > div').toggleClass('col-xs-6').toggleClass('col-xs-12');
lastTrigger = $(this).closest('div').attr('id');
scrollView(updateOffset);
});
function updateOffset() {
var currentOffset = target.offset().top;
return currentOffset;
}
function scrollView() {
$('html,body').animate({
scrollTop: currentOffset
}, 1000);
}
最佳答案
这里的问题是,当您单击按钮时,您的 target
并未更新,因为 lastTrigger
在变量初始化时未定义。因此,当您在事件监听器中定义 lastTrigger
时,不会发生任何事情。
I created a fiddle通过仅在初始化 lastTrigger
后初始化 target
并相应更新scrollTop,解决了此问题。
var lastTrigger;
var target;
$('button').click(function () {
$('.row > div').toggleClass('col-xs-6').toggleClass('col-xs-12');
lastTrigger = $(this).closest('div').attr('id');
scrollView();
});
function updateOffset() {
target = $('#' + lastTrigger);
var currentOffset = target.offset().top;
return currentOffset;
}
function scrollView() {
$('html,body').animate({
scrollTop: updateOffset()
}, 1000);
}
希望能解决您的问题。
关于javascript - 使用更新的偏移位置实现点击事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30031949/