Jquery循环遍历运行时创建的元素

i have a list that is passed to a page and the elements are created at runtime. I would like to loop through these elements and preform some action for each element. Under is my code: for each person that gets created from this list i would like to preform a check on that person. Can someone help me i am only getting the check happening once:

我有一个传递给页面的列表，元素是在运行时创建的。我想对这些元素进行循环，并为每个元素提供一些操作。下面是我的代码:对于从这个列表中创建的每个人，我都希望对其进行预先检查。有人能帮我一下吗?我只收到一次支票:

jQuery:

$(document).ready(function() {

    $("#userId").each(function(i){
        if ($("#userId").val != '') {
            alert('not null' + i);
        }
    });                 
});

JSP:

<c:forEach items="${person}" var="person">

<input= type="text" id="userId" value="${person.userid}" />
    First name:- ${person.fName} , Last Name:- ${person.lName}
</c:forEach>

4 个解决方案

#1

you cannot have multiple elements on a page with the same id attribute. try using classes instead.

不能在具有相同id属性的页面上有多个元素。试着用类来代替。

try something like:

尝试:

$(document).ready(function() {

   $(".userId").each(function(i){
       if ($(this).val() != '') {
           alert('not null' + i);
       }
   });
});

Another thing to note is that .val is a method, so you need to call it to get the value. Use .val() instead of .val. As you have your code now, $(selector).val is a function, so it will never be the empty string you are testing it against.

需要注意的另一件事是。val是一个方法，因此需要调用它来获得值。使用.val()代替。val。就像现在的代码一样，$(选择器)。val是一个函数，所以它永远不会是要测试的空字符串。

Also your JSP should be something like:

您的JSP应该类似于:

<c:forEach items="${person}" var="person">

<input= type="text" class="userId" value="${person.userid}" />
    First name:- ${person.fName} , Last Name:- ${person.lName}
</c:forEach>

#2

Your loop will create multiple element with same ID, first change that. It is better to use class names instead.

您的循环将创建具有相同ID的多个元素，首先改变它。最好使用类名。

<c:forEach items="${person}" var="person">

    <input= type="text" class="user" id="userId-${person.userid}" value="${person.userid}" />
       <!--             ^ Use Class &  ^ Id to uniquely identify the user -->
       First name:- ${person.fName} , Last Name:- ${person.lName}
</c:forEach>

Next you can use .find() to find even the dynamically generated element. But I recommend using my solutions using the class attribute.

接下来，您可以使用.find()来查找动态生成的元素。但是我推荐使用我的解决方案使用class属性。

$(".user").each(function(i) {
    if ($(this).val() != '') {
          alert('not null' + i);
    }
});

#3

As @Andbdrew said, use a class instead of an id, as it will stop looking for more items after it finds the first that matches the id.

正如@Andbdrew所说，使用类而不是id，因为在找到与id匹配的第一个之后，它将停止查找更多的项。

Also, you'll want to use this instead of $("#userId") inside our function.

此外，您将希望在函数中使用它，而不是使用$(“#userId”)。

So do something like this:

所以做这样的事情:

$(".userClass").each(function(i) {
    if ($(this).val() != '') {
        alert('not null' + i);
    }
});

#4

Why don't you select with TAG by jQuery. For example the element having your users list is a table with id tblUsers then you can itereate over runtime generated TRs or TDs as following:

为什么不使用jQuery标记进行选择呢?例如，拥有用户列表的元素是一个具有id tblUsers的表，然后您可以在运行时生成的TRs或TDs上进行迭代，如下所示:

$("#tblUsers tr").each(function(i){
        alert('td' + i);
 });

further if you have inputs in tds you can go deep in selection as

此外，如果在tds中有输入，可以深入选择as

$("tblUsers tr td input")

#1