多個變化事件

Question

我有3 <select>菜單，每個菜單都有改變事件的工作。破解密碼的下跌看起來是這樣的：

$(document).ready(function(){ 
    // some code 

    $("#selectOne").change(function() { 
     // some code inc ajax request 

     $("#selectTwo").change(function() { 
      // some code inc a different ajax request 
     }); 

     $("#selectThree").change(function() { 
      // some code inc a yet another ajax request 

     }); 
    }); 
}); 

上述的問題是，雖然selectOne工作正常，並selectTwo似乎做工精細也是，如果我改變selectThree，代碼爲兩個selectTwo和selectThree火災與此同時。根據3個選擇中任何一個的選擇順序，selectThree.change的響應可以是在顯示不正確的響應之前顯示和隱藏每個先前的響應。

我想要做的是這樣的：

$(document).ready(function(){ 
    // some code 

    $("#selectOne").change(function() { 
     // some code inc ajax request 
    }); 

    $("#selectTwo").change(function() { 
     // some code inc a different ajax request 
    }); 

    $("#selectThree").change(function() { 
     // some code inc a yet another ajax request 

    }); 
}); 

在這種情況下，selectOne工作正常，但selectTwo和selectThree不響應變化。

是否有糾正任何這種情況的方法，以便每個元素髮生更改時，只有正確的更改事件被觸發？

Answer 1

看來，當你的文件加載時，沒有選擇元素的ID爲「selectTwo」或「selectThree」。同樣，在第一種情況下，執行「selectOne」的事件處理程序時不會出現「selectThree」。這就是相應的事件處理程序不執行的原因。有兩種方法可以處理這個問題。

1 -創建元素時分配處理程序。

2 -使用.on()而不是.change()：

$('body').on("change", "#selectOne", function() {}); 

$('body').on("change", "#selectTwo", function() {}); 

$('body').on("change", "#selectThree", function() {});