Javascript/PHP/JSON：根據第一個選擇更新選擇輸入

Question

我正在製作一個表單，詢問有關可以有多少個孩子以及他們幾歲的信息。目標是根據第一次選擇的次數（兒童數量）顯示正確的年齡選擇次數。我有一個PHP文件，其中我得到我的JSON文件（問題在哪裏）的內容，它根據JSON文件中的屬性創建正確的輸入（例如：「criteria_type」=「select」 ，PHP將創建一個選擇輸入）。

的PHP代碼看起來像這樣：

if($grp_critere['crt_type'] == 'select') { 

    $html_grp_criteres = '<select name="'. $grp_critere['crt_id'].'|scq_'.$grp_critere['question_key'].'" onchange="change_select_number">'.$html_grp_criteres.'</select>'; 
} 

的問題是，我必須表明只有選擇我需要的，如果一個人選擇3個孩子，3個選擇隨着年齡的選擇將出現輸入。

因此，我創建兩型「crt_type」，爲不同類型的選擇：

1. select_origine：第一個它改變下選擇輸入

2. select_update數量：選擇誰取決於所選擇的數字

任何想法在Javascript中使用onchange函數或.jquery中的變化使它成爲可能嗎？

感謝

Answer 1

創建一個div是（因爲在這個例子中的ID我給它「input_container」）爲你的額外選擇元素的容器。

我還給出了最初的選擇框（兒童人數）「選擇」的ID。

基於您的代碼，#selection已經觸發時，它改變了change_select_number功能，所以這是所有你需要做的：

function change_select_number(){ 
    if($("#selection").val() > $("#input_container").children().length){ // if we need to add fields 
     num = $("#selection").val() - $("#input_container").children().length; // find out how many elements we need to add 
     for(i=0;i<num;i++){ 
      $("#input_container").append("<select style='display:block;' name='select_update["+$("#input_container").children().length+"]'><option>1<option>2</select>"); // add a select as a child of #input_container 
     } 
    }else if($("#selection").val() < $("#input_container").children().length){ // if we need to remove fields 
     num = $("#input_container").children().length - $("#selection").val(); // find out how many elements to remove 
     for(i=0;i<num;i++){ 
      $("#input_container select:last-child").remove(); // remove the last select from #input_container 
     } 
    } 
}