jQuery - 循环使用具有特定属性的元素

Question

我知道如何遍历下面的输入,搜索具有特定类"测试者"的输入

以下是我的表现方式:

<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>

它按预期输出"John","Smith".

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

所以这就是我要做的事情:

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

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

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

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

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

Answer 1

这是使用HTML5 data-*属性:

HTML:

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

JS:

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

这是工作:http://jsfiddle.net/SFVYw/

更简单的方法是使用这个JS:

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

在内部,它与其他JS代码一样,但它只是更简洁一些.

Answer 2

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

工作演示