Question

在下面的代码中，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');
}

Answer 1

编辑以反映对该问题的新理解

~~您要做的是为更改事件传递回调函数，如下所示：~~

我现在理解的是，当您更改滑块的值时，您希望触发更改事件。您可以通过以下方式以编程方式设置值：

$('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');
    }
});

Answer 2

保证在滑块分配后运行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;新来的。

为什么for循环在此代码中的Jquery Selector之前执行？

2 个答案: