jquery更新動態添加下拉

Question

我有一個jQuery的功能，更新一些下拉選項的選擇一些輸入框。我也動態添加儘可能多的選擇，因爲我想使用與第一個選擇相同的id的addRow函數。但是，jquery函數不會爲新選擇而觸發。下面是我用於更新輸入框的jQuery：

​​

而且還addRow功能：

function addRow(tableID) 
{ 
     var table=document.getElementById(tableID); 
     var rowCount=table.rows.length; 
     var row=table.insertRow(rowCount); 
     var colCount=table.rows[0].cells.length; 

     for(var i = 0; i < colCount; i++) 
     { 
      var newcell = row.insertCell(i); 
      var oldId = table.rows[0].cells[i].childNodes[1].text; 
      newcell.innerHTML = table.rows[0].cells[i].innerHTML; 

      switch(newcell.childNodes[i]) 
      { 
       case"#text": 
        newcell.childNodes[i].value=""; 
        break; 
       case"#checkbox": 
        newcell.childNodes[i].checked=false; 
        break; 
       case"#select-one": 
        newcell.childNodes[i].selectedIndex=0; 
        break; 
      } 


     } 
    } 

而且我下面的HTML代碼：

<table id="recipes" class="table"> 
     <a href="#" onclick="addRow('recipes');" class="btn btn-default"> 
      <span class="glyphicon glyphicon-plus"></span> Add Another Recipe 
     </a> 
     <a href="#" onclick="deleteRow('recipes');" class="btn btn-danger"> 
      <span class="glyphicon glyphicon-trash"></span> 
     </a> 
     <tr> 
      <td> 
       <select name="menusName" id="menusName" required> 
        <option>Choose a Menu</option> 
        <?php if($menus != null){ 
         foreach($menus as $r){ ?> 
         <option><?php echo $r->menuName;?></option> 
        <?php }}?> 
       </select> 
      </td> 
      <td>Makes: <input readonly name="makes" id="makes" type="text" required/></td> 
      <td>Cake Type: <input readonly name="type" id="type" type="text" required/></td> 
      <td>Multiply Recipe by: <input name="mulRecipe" id="mulRecipe" type="text" required/></td> 
     </tr> 
    </table> 

Answer 1

嘗試使用$(document).ready()功能：

$(document).ready(function() { 
    /* your code */ 
});