jquery函數不工作？

Question

我有一個選擇字段。當用戶從字段中選擇選項時，我想根據用戶選擇顯示輸出。例如，如果用戶選擇2，那麼我想兩次顯示'hello world'。這是我迄今爲止所做的。

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> 

<p>Select Option:<select id="noAct"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option 
    </select> 


<p id="tables"></p> 

<script> 
    function displayTable() 
    { 
     var value = $("#noAct").val(); 

     //for loop to display the no of tables required 
     for (var i=0; i<value; i++) 
     { 
      //display the table 
      $("#tables").html("<b>Hello World</b>"); 

     } 
    } 

    $("select").change(displayTable); 
    displayTable(); 
</script> 

我沒有輸出或任何。有人能幫我嗎？

Answer 1

修正語法錯誤，並在循環使用append()，不html()因爲它覆蓋在每次迭代

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> 

<p>Select Option:</p> 
<select id="noAct"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
</select> 


<p id="tables"></p> 

<script> 
    function displayTable() { 
     var value = $("#noAct").val(); 

     $("#tables").empty(); 

     for (var i=0; i < value; i++) { 
      $("#tables").append("<b>Hello World</b><br />"); 
     } 
    } 

    $("select").change(displayTable); 
    displayTable(); 
</script> 

FIDDLE

Answer 2

嘗試像下面，

$(document).ready(function() { 

    $("select").change(displayTable); 

}); 

Answer 3

嘗試內容這個：

<script> 

$(document).ready(function(){ 
    $("#noAct").on('change', function(){ 
     var value = $(this).val(); 

     //for loop to display the no of tables required 
     $("#tables").html(); 
     for (var i=0; i<value; i++) 
     { 
      //display the table 
      $("#tables").append("<b>Hello World</b><br />"); 

     } 
    }); 
}); 
</script>