jQuery的on（）事件不触发对sweetalert2文本框

Question

我已动态创建文本框在sweetalert2这样的：

swal({ 
    title: 'Enter Info', 
    showCancelButton: true, 
    html: "<table>" + 
       "<tr>" + 
        "<td>name</td>" + 
        "<td><input type='text' id='name'/></td>" + 
       "</tr>" 
       "<tr>" + 
        "<td>email</td>" + 
        "<td><input type='text' id='email'/></td>" + 
       "</tr>" 
      "</table>" 
}).then(function(){ 
    // ajax 
}); 

和jQuery函数监听文本框更改事件。

$(document).ready(function() { 
    <script type="text/javascript"> 
     $('#name').on('change', function(e) { 
      console.log($(this).val()); 
     }); 
    </script> 
}); 

但是，在更改sweetalert2中的文本框值时，事件未被触发。 jQuery被正确加载，它可以在sweetalert2模型之外的其他文本框中使用。我也尝试在</table>之后加上<script>...</script>以上html:但仍然没有运气。有人可以帮我吗？任何投入将不胜感激。

Answer 1

变化$('#name').on('change', function(e) {到$(document).on('change','#name', function(e) {

1. 代表时的正确

Answer 2

出现这种情况，因为你正在使用

$('#name').on('change', function(e) {}); // this works for static dom 

$(document).on('change','#name', function(e) {}); // this works for static as well as content dynamically added in dom.