Question

我默认以html格式输入一个字段。如果用户想要添加更多，他们可以添加更多输入字段。我已经通过jquery添加了更多输入字段功能。现在我想获得新添加的字段ID并使用jquery验证这些输入字段。但是jquery没有获得那些添加的id。这是我的表格正常输入字段

defer

现在这是我动态添加输入字段代码

<td> <input readonly type="text" name="student_id[]" placeholder="{{ $details->batch_id }}" value="{{ $details->batch_id}}" class="form-control"> </td>

这是我的jquery代码来获取这个新添加的输入字段

var tr='<tr>'+
    '<td> <input type="text" name="student_id[]" class="form-control" id="addedstudent-id"> </td>'+
    '</tr>';

但它没有在$('#addedstudent-id').focusout(function(){ console.log('d'); });中显示任何内容。甚至没有任何错误。

Answer 1

动态创建元素时，需要使用父静态选择器监听元素。 e.g：

$('table').on('focusout', '#addedstudent-id', function() {
  //do something
  console.log('d');
});

Answer 2

如果您动态添加元素，您必须在添加到文档后设置处理程序。

E.g，

var tr='<tr>'+
'<td> <input type="text" name="student_id[]" class="form-control" id="addedstudent-id"> </td>'+
'</tr>';
//If you add handlers here, It will not work since element is not in the document, jquery will not find it.
$('#some-element').append(tr);

 $('#addedstudent-id').focusout(function(){
    console.log('d');
});

应该工作，我曾经这样面对过。

Answer 3

Loading.Show();

您可以使用document来设置监听器。所以无论你把新元素放在哪里，你都可以确定该函数会触发。

jquery没有动态添加输入字段id

3 个答案: