jQuery - 循环遍历具有特定属性的元素

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16086174/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 16:23:30  来源:igfitidea点击:

jQuery - Looping through elements with specific Attribute

jquerycustom-attributeseach

提问by coffeemonitor

I know how to loop through the inputs below, searching for the ones with a specific class of "testers"

我知道如何遍历下面的输入,搜索具有特定“测试人员”类别的输入

And here's how I do that:

这是我如何做到的:

<input type='text' name='firstname' class="testing" value='John'>
<input type='text' name='lastname' class="testing" value='Smith'>

<script type="text/javascript">
$(document).ready(function(){

 $.each($('.testing'), function() { 
   console.log($(this).val());
 });

});
</script>

It outputs the "John", "Smith" as expected.

它按预期输出“John”、“Smith”。

I want to not use the class="testing"and use a custom attribute: testdata="John".

我不想使用class="testing"并使用自定义属性:testdata="John"

So this is what I'd be doing:

所以这就是我要做的:

<input type='text' name='firstname' testdata='John'>
<input type='text' name='lastname' testdata='Smith'>

My goal is to auto-populate the values of each input with whatever is inside testdata, but only those detected to have the testdataattribute.

我的目标是使用内部的任何内容自动填充每个输入的值testdata,但仅那些检测到具有该testdata属性的值。

This was my failed attempt at using the $.eachloop:

这是我使用$.each循环失败的尝试:

$.each($('input').attr('testdata'), function() {
  var testdata = $(this).attr('testdata');
  $(this).val(testdata);    
});

I get this response: Uncaught TypeError: Cannot read property 'length' of undefinedCan anyone see what I'm doing wrong?

我得到这样的回应:Uncaught TypeError: Cannot read property 'length' of undefined谁能看到我做错了什么?

回答by Joe

Here it is using the HTML5 data-*attribute:

这里使用的是 HTML5data-*属性:

HTML:

HTML:

<input type='text' name='firstname' data-test='John'>
<input type='text' name='lastname' data-test='Smith'>

JS:

JS:

$("input[data-test]").each(function(){
    var testdata = $(this).data('test');
    $(this).val(testdata);
});

Here it is working: http://jsfiddle.net/SFVYw/

它正在工作:http: //jsfiddle.net/SFVYw/

An even shorter way of doing it would be using this JS:

一个更短的方法是使用这个 JS:

$("input[data-test]").val(function(){
    return $(this).data('test');
});

Internally it's doing the same as the other JS code but it's just a little more concise.

在内部,它的作用与其他 JS 代码相同,但只是更简洁一点。

回答by Mohammad Adil

$("input[testdata]").each(function(){
  alert($(this).attr('testdata'));
 // do your stuff
});

working demo

工作演示

回答by Gouda Elalfy

if you want to select inputs with specific attribute name and you have these html inputs:

如果您想选择具有特定属性名称的输入并且您有这些 html 输入:

<input type='text' name='user1' fieldname="user" class="testing" value='John1'>
<input type='text' name='user2' fieldname="user" class="testing" value='Smith1'>
<input type='text' name='admin1' fieldname="admin" class="testing" value='John2'>
<input type='text' name='admin2' fieldname="admin" class="testing" value='Smith2'>

you can loop on admins only like this:

你只能像这样循环管理员:

$("input[fieldname='admin']").each(function(){
    alert($(this).val());
});

by the same way, you can loop for users only:

同样,您只能为用户循环:

$("input[fieldname='user']").each(function(){
    alert($(this).val());
});

回答by qwerty

For iterating over all elements with testdataattribute and assigning form fields with what their attribute holds try

为了迭代具有testdata属性的所有元素并为其属性所拥有的表单字段分配尝试

$("[testdata]").each(function(){
    $(this).val($(this).attr('testdata'))
})

[works with all elements i guess]

[我猜适用于所有元素]