[英]jQuery - Looping through elements with specific Attribute
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 testdata
attribute. 我的目标是使用
testdata
任何内容自动填充每个输入的值,但只检测那些具有testdata
属性的值。
This was my failed attempt at using the $.each
loop: 这是我尝试使用
$.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 undefined
Can anyone see what I'm doing wrong? 我得到了这个回复:
Uncaught TypeError: Cannot read property 'length' of undefined
任何人都可以看到我做错了什么?
Here it is using the HTML5 data-*
attribute: 这里使用的是HTML5
data-*
属性:
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代码一样,但它只是更简洁一些。
$("input[testdata]").each(function(){
alert($(this).attr('testdata'));
// do your stuff
});
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());
});
For iterating over all elements with testdata
attribute 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] [适用于我猜的所有元素]
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.