Javascript 使用更新的偏移位置实现单击事件

我有一个按钮，当单击时，它会将默认的2柱网轴线更改为单柱网轴线。此单击事件之后，列中包含元素的Y偏移位置将发生更改

我需要知道更新后的Y偏移位置，以便能够在柱网格更改后立即

滚动到某个元素，但我似乎无法使代码正常工作，也不确定我的结构是否是保持所有元素同步的正确重构方式

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);
}

这里的问题是，当您单击按钮时，
目标
没有更新，因为在初始化变量时，
lastTrigger
未定义。因此，当您在事件侦听器中定义
lastTrigger
时，不会发生任何事情

通过仅在初始化
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);
}

我希望这能解决您的问题。
这里的问题是，当您单击按钮时，
目标
没有更新，因为在初始化变量时，
lastTrigger
未定义。因此，当您在事件侦听器中定义
lastTrigger
时，不会发生任何事情

通过仅在初始化
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);
}

我希望这能解决您的问题。
应该注意的是，
target
元素是
最近的
方法返回的元素，因此
$（'#'+lastTrigger）
调用是多余的。谢谢，但我认为在进行列切换后不会得到目标元素的偏移值。请查看我的小提琴，例如，如果单击面板2的展开按钮，我希望滚动到展开视图中的面板2。应该注意，
target
元素是由
最近的
方法返回的元素，因此
$（“#”+lastTrigger）
调用是多余的。谢谢，但我认为在进行列切换后，不会得到目标元素的偏移量值。请查看我的小提琴，例如，如果您单击面板2的展开按钮，我希望在展开视图中滚动到面板2。谢谢。这是你的建议，但我仍然没有得到我想要的结果。如果你能帮助我实现目标，我将不胜感激。e、 g.如果单击面板2的“展开”按钮，我希望滚动条在“展开”视图中移动到面板2。@SeongLee，它不起作用，因为jQuery animate显然不能很好地处理CSS转换。如果您添加了一个超时，以便在转换完成后滚动，它将起作用。看一看：这太完美了！不知道CSS转换在jQuery动画功能上会有问题。非常感谢：）这可能有助于处理未来的过渡。不知道为什么会有问题，但这可能是一个解决方案，谢谢。这是你的建议，但我仍然没有得到我想要的结果。如果你能帮助我实现目标，我将不胜感激。e、 g.如果单击面板2的“展开”按钮，我希望滚动条在“展开”视图中移动到面板2。@SeongLee，它不起作用，因为jQuery animate显然不能很好地处理CSS转换。如果您添加了一个超时，以便在转换完成后滚动，它将起作用。看一看：这太完美了！不知道CSS转换在jQuery动画功能上会有问题。非常感谢：）这可能有助于处理未来的过渡。确切地说，我不知道为什么会有问题，但这可能是一个解决办法