为什么在这段代码中for循环在Jquery选择器之前执行?

Why do for loop executes before Jquery Selector in this code?

本文关键字：选择器 Jquery 循环 执行 for 段代码 代码 为什么      更新时间：2023-09-26

在下面的代码中，for循环总是先执行，jQuery选择器稍后执行。但是我想在改变选定滑块的值之后运行这个for循环

$('div[name="FirstSliderselector"]').slider('value', $("#MasterSlider").slider("value"));
var FirstSliders = $('div[name="FirstSliderselector"]');
for (var i = 0; i < FirstSliders.length; i++) {
     console.log('for loop executed');
}

编辑反映对问题的新理解

你要做的是传递一个回调函数的变化事件，像这样:

我现在理解的是，当你改变滑块的值时，你想触发一个改变事件。您可以在某处通过编程设置该值:

$('div[name="FirstSliderselector"]').slider('value', $('#MasterSlider').slider('value'));

为了让你的for循环在你这样做之后执行，你需要将一个变化事件绑定到滑块上，如下所示:

$('div[name="FirstSliderselector"]').slider({
    change: function (event, ui) {
        var firstSliders = $('div[name="FirstSliderselector"]'),
            i;
        for (i = 0; i < firstSliders.length; i += 1) {
            console.log(ui.value);
        }
    }
});

你也可以这样做:

$('div[name="FirstSliderselector"]').on('slidechange', function (event, ui) {
    var firstSliders = $('div[name="FirstSliderselector"]'),
        i;
    for (i = 0; i < firstSliders.length; i += 1) {
        console.log(ui.value);
    }
});

如果你想确保这只在数值改变是通过编程完成的时候触发，而不是在滑动块滑动之后，你的回调函数变成这样:

function (event, ui) {
    if (!event.originalEvent) {
        var firstSliders = $('div[name="FirstSliderselector"]'),
            i;
        for (i = 0; i < firstSliders.length; i += 1) {
            console.log(ui.value);
        }
    }
}

最后，如果这些都不能满足你的需求，正如Chris GW Green所建议的那样，总有一个完成后的结构:

$.when($('div[name="FirstSliderselector"]').slider('value', $('#MasterSlider').slider('value'));).then(function () {
    var firstSliders = $('div[name="FirstSliderselector"]'),
        i;
    for (i = 0; i < firstSliders.length; i += 1) {
        console.log('for loop executed');
    }
});

保证在滑动块赋值后运行for循环…

var FirstSliders = $('div[name="FirstSliderselector"]'),
    MastSliderValue = $("#MasterSlider").slider("value");
function updateSliders(){
    FirstSliders.slider('value', MastSliderValue);
}
$.when(
    updateSliders()        
).done(
    function(){
        for (var i = 0; i < FirstSliders.length; i++) {
             console.log('for loop executed');
        }
    }
);

谢谢你第一次尝试-1的家伙;)这是新的

相关文章：