Question

当我使用变量搜索具有与变量值相同的类名的元素时，下面的.each循环不起作用。结果;没有警报发生。

var NameString = $("#StoreInputs").val();
var NameArray = NameString.split(",");
for(var i = 0; i < NameArray.length; i++){
$('.' + NameArray[i]).each(function(n, obj){
  alert(obj.val());
    });
}

Answer 1

纠正您的.each()循环：

而不是

$('.' + NameArray[i]).each(function(n, obj){
  alert(obj.val());
});

尝试

$('.' + NameArray[i]).each(function(index,value){
  alert($(value).val());
});

编辑： -

DEMO

Answer 2

尝试

var NameString = $("#StoreInputs").val();
var NameArray = NameString.split(",");
for (var i = 0; i < NameArray.length; i++) {
    //trim the class name to remove any leading spaces
    $('.' + $.trim(NameArray[i])).each(function (n, obj) {
        //obj is a dom element reference, so doesn't have the val() method
        //so wrap it using jQuery object
        alert($(obj).val());
    });
}

Answer 3

将你的foreach改为

$('.' + NameArray[i]).each(function(){
  alert($(this).val());
});

您正在循环到每个html而不是循环到javascript数组对象。 jquery中有两种类型的each jQuery.each 和 .each

jQuery.each 如果是数组，如果要循环到 NameArray的所有元素

jQuery.each( NameArray, function( index, value ) {
    alert(value);
});

和 .each 一个，如果用于指定您指定的标识符的html元素的循环

$('.' + NameArray[i]).each(function(){
  alert($(this).val());
});

以下是 FIDDLE DEMO 来演示

<input type="text" id="classlist" value="class1,class2" /> 
<ul>
    <li class="class1">TEXT 1</li>
    <li class="class2">TEXT 2</li>
    <li class="class3">TEXT 3</li>
    <li class="class3">TEST 4</li>
</ul>
<div id="eachContent">
    Contents retrieved using .each
</div>
<div id="jqueryeachContent">
    Contents retrieved using jQuery.each
</div>
<script>
    jQuery(document).ready(function(){
      // Using jQuery.each looping of array
      var nameArray = jQuery('#classlist').val().split(',');
      jQuery.each( nameArray, function( index, value ) {
          $('.' + value).each(function(){ 
               jQuery("#eachContent").html(jQuery("#eachContent").html() + '<br>' + $(this).text());
          }); 
      });
      // using .each looping of elements
       $('.class3').each(function(){ 
           jQuery("#jqueryeachContent").html(jQuery("#jqueryeachContent").html() + '<br>' + $(this).text());
       });
    });
</script>

Answer 4

obj是原始输入，要.val()使用$(obj)：

var NameString = $("#StoreInputs").val();
var NameArray = NameString.split(",");
for(var i = 0; i < NameArray.length; i++){
  $('.' + NameArray[i]).each(function(n, obj){
    alert($(obj).val());
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="StoreInputs" value="cl2,cls1"/>
<input class="cls1 cls2" value="in1"/>
<input class="cls2" value="in2"/>
<input class="cls1 cls3" value="in3"/>

有关信息obj == this。

当迭代具有动态类名的元素时，JQuery .each循环不起作用

4 个答案: