為什么在此代碼中for循環在Jquery Selector之前執行？

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

編輯以反映對問題的新理解

您要做的是為change事件傳遞一個回調函數，如下所示：

我現在了解的是，您想在更改滑塊的值時觸發更改事件。 您可以通過以下方式以編程方式設置該值：

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

為了使for循環在執行完之后執行，您需要將一個change事件綁定到滑塊，如下所示：

$('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在第一次嘗試的家伙;）這是新的。