jquery - 選項選擇樹

我有一些「選項選擇樹」代碼的麻煩。第一步工作正常，但第二個不行。我不明白爲什麼...jquery - 選項選擇樹

function show_opt(id,options){ 
    var n = id.val(); 
    var nexts = (id.next('select')); 

    var showOptions = options.filter('.'+n); 
    nexts.html(showOptions); 
    nexts.prop('selectedIndex', 0); 
} 

$(document).ready(function() { 
    var select = $('#group1').children('select'); 
     var sn = select.eq(0); 

     sn.change(function(){ 
     $('#print').val((sn.val())); 

     var next_s = sn.next('select'); 

     var fontOptions = next_s.children('option').remove(); 
     show_opt(sn,fontOptions); 
     }); 
});

這裏是一個演示：Jsfiddle

來源

2013-10-10 meskeight

「0」，「1」等不是有效的CSS類。 –

我知道，但我只用它們來過濾提交選項 – meskeight

提示：使用調試器查看您使用的變量的值是什麼。

基本上，你的代碼執行以下操作（從第一個菜單假設你選擇，例如，main_4）：

上$('#main').change()從#sub0刪除所有12個<option>元素。
您將這些元素（仍然是12）傳遞給show_opt並對它們進行過濾，因此只剩下3個（sub0_4.1等）。
您將這3個元素附加到#sub0。現在#sub0有只有3<option>元素。
on change()還有只有3元素在#sub0。假設您這次選擇main_3 - 之後filter()那些3 <option> eleh在show_opt，沒有剩餘。

希望現在，你很清楚爲什麼你的代碼不工作。

來源

2013-10-10 13:23:34

如果您可以看到Js示例，那麼當您更改第一個菜單的值時，它會更改第二個菜單的值。我把文本字段放在最後只是爲了調試我認爲show_opt函數有一個僞裝，但我無法修復它 – meskeight

正如我在我的回答（和@David Fregoli也說過的）中所說的，你刪除第二個菜單中的所有元素與您的filter（）不匹配，因此在下次篩選時，您只有那些之前未被刪除的元素。我編輯了我的答案，使其更加清晰。 –

我遵循你的提示......現在它的工作原理！結果 - > [鏈接]（http://jsfiddle.net/meskeight/MYw4q/2/） – meskeight

當篩選下來，你不需要那些被刪除的元素。當你做第二次過濾時，它不會從整個集合開始，而是從第一個過濾結果開始

來源

2013-10-10 13:19:43

jquery - 選項選擇樹

回答

相關問題