使用jQuery动态生成的目标内容

Question

我有10个动态创建的输入框，我想对它们进行简单的验证，以确保它们不为空。问题在于，我现有的代码对它们无效，因为它们不是在页面加载时创建的。

我该如何实现这一点？ 提前感谢您的帮助。

function submitForm() {
    for(var i = 0; i < 10 ; i++){
        if($("#input"+i).value == null){
            alert("False!!");
        }
    }
}

- Carolina Vicente

---

我会使用 jQuery 的 .each 来解决这个问题，你试过了吗？ - theblindprophet

尝试类似这样的东西 https://jsfiddle.net/Lg0wyt9u/394/? - Nenad Vracar

$("#input"+i).value 不管是动态的还是静态的都不起作用，因为 jQuery 对象没有 value 属性。相反，您应该使用 $("#input"+i).val()。 - MrCode

谢谢Nenad Vrakar，它完美地工作了！！！ - Carolina Vicente

@Carolina Vicente，我已将其发布为答案。 - Nenad Vracar

Answer 1

你应该使用.val()而不是.value。我还建议使用.each()。此外，当input为空时，它的值是""而不是null。

 for(var i = 0; i < 10 ; i++) {
    if($("#input"+i).val() == "") {
        alert($("#input"+i).attr('id') + " is empty!")
    }
 }

JSFiddle

- Somrlik

Answer 2

您应该使用val()来检查输入值，而不是value

(function() {
  var i = 0;
  $('button').click(function() {
    $('body').append('<input type="text" id="input-' + i + '">');
    i++;
  });

  $('input[type="submit"]').click( function() {
    $('input[type="text"]').each(function() {
      if ($(this).val() == '') {
        alert($(this).attr('id') + ' is empty');
      }
    });
  });
})();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="submit" value="Submit">
<button>Create input</button>

- Nenad Vracar