jQuery僅附加到現有對象

Question

我試圖創建一個按鈕，onclick在頁面上添加了一些新的html元素，但jQuery沒有附加到新對象。

<script> 
jQuery(document).ready(function(){ 
    jQuery("input[type='button']").click(function(){ 
     var ask=confirm('Are you sure'); 
     if(ask){ 
      var n=jQuery(this).parent(); 
      var s=jQuery(this).prop('id'); 
      n.html('Select Picture: <br><input type="file" name="'+s+'" id="'+s+'" required>'); 
      } 
     } 
    }); 
    jQuery(":file").change(function() { 
     var na=jQuery(this).val(); 
     alert(na); 
    }); 
}); 
</script> 

現在這裏是該代碼form例如：

<form> 
      <div><img src="image/source"><br> 
      <input type="checkbox" required value="1" name="product1">image is ok<br> 
      <input type="button" value="change image" id="product1" name="product1b"></div> 
<input type="file" name="product2"> 
</form> 

所以，當我在button的form更改，請單擊此：

<form> 
<div> 
Select Picture: <br> 
<input type="file" name="product1" id="product1" required> 
</div> 
<input type="file" name="product2"> 
</form> 

的問題是，jQuery函數jQuery(":file").change(function() {適用於product2，但不適用於product1，因爲它不在第l頁上oad和jQuery未附加到它。

Answer 1

你必須使用你的時，元素是動態委託的事件：我認爲你已經錯過了正常的閉合支架

jQuery(document).on('change', ':file', function(){ 
    // do stuff 
});