Question

我在select元素上有一个on change函数，用于触发ajax请求和响应。在最近的某个时刻，它开始运行两次，但不是更改触发器本身。只是改变功能里面的一切。重复：更改功能仅触发一次，但函数的内容运行两次。这是两周前没有发生的（上次我检查过），从那以后我没有改变任何相关的代码。刚刚升级到WordPress 4.5。这是代码（注释中包含控制台日志信息）：

$('body').on('change', 'select#users_view', function()
{
    var view = $(this).val();
    console.log('triggered '+view); // this only prints ONCE
    $('html, body').animate({scrollTop:0}, 250, function()
    {
        console.log('scroll top '+view); // this prints TWICE
        $.post(application_ajax.ajaxurl,{action:'application_ajax',dataType:'html',class:'views_users_management',method:'switch_view',view:view},function(response)
        {
            if('status' in response)
            {
                if(response.status == 'success') 
                {
                    console.log('success '+view); // this prints TWICE
                    $.ReplaceUsersContainer(response.html, false);
                }
                else if(response.status == 'error') $.showError(response.message);
                else $.showError();
            }
            else $.showError();
        });             
    });
});

究竟是什么？ javascript文件只加载一次。没有其他javascript文件在任何地方引用此select元素。如控制台日志所示，更改功能仅被触发一次。但由于某种原因，animate函数运行了两次。

修改的我刚刚想到它可能正在运行两次，因为animate函数的选择器是html, body，但之前jQuery的情况从未出现过，如果这是jQuery现在正在做的事情，我已经有成千上万的要修改的javascript文件。

Answer 1

哇，谢谢jQuery。使用html，body作为scrollTop函数的选择器已经成为我们很多人很长一段时间的标准练习，现在它的行为有所不同，我们都有很多工作要做。 EVEN WORDPRESS CORE FILES在动画功能上使用html,body。

简而言之：选择器html，body现在会导致动画函数在jQuery v1.12.3中运行两次，而在以前的版本中，情况并非如此。

编辑感谢Developer107以下的第一个评论

由于Firefox需要html而Chrome等需要body，因此修复此问题的方法是使用去抖功能。

我使用这个小插件：https://github.com/cowboy/jquery-throttle-debounce/

然后像这样调用我的函数：

$('html,body').animate({scrollTop:0}, 250, $.debounce(0, true, function()
{
    // do stuff
}));

Scrolltop功能运行两次

1 个答案: