使用数组作为动态JQuery字符串变量名称

摘要：我已将ID选择标记的名称传递给数组。我想动态分配每个选择项目，以便在更改时显示所选项目的索引。这被发送到输出格。只有第三个选择项被动态地触发。为什么？使用数组作为动态JQuery字符串变量名称

<script language="JavaScript" type="text/javascript"> 

$(document).ready(function(){ 

var NameOfSelect=new Array("a","b","c"); 

for (i=0;i<NameOfSelect.length;i++){ 

var sel=NameOfSelect[i]; 
$("#"+NameOfSelect[i]).change(function() { 
      var str = ""; 
      $("#"+sel+" option:selected").each(function() { 
      str += $(this).index() + " "+$("#"+sel).attr("id"); 
        }); 
      $("#output").text(str); 
     }) 
     .trigger('change'); 

} 
</script>

的HTML

<select id="a" > 
<option value="0a" >0a</option> 
<option value="1a" >1a</option> 
<option value="2a" >2a</option> 

</select> 


<select id="b" > 
<option value="0b" >0b</option> 
<option value="1b" >1b</option> 
<option value="2b" >2b</option> 
</select> 

<select id="c" > 
<option value="0c" >0c</option> 
<option value="1c" >1c</option> 
<option value="2c" >2c</option> 

</select> 
<div id=output></div>

输出显示，只有 “C” 被触发的改变。为什么“a”和“b”没有被类似地动态分配？

来源

2012-06-22 John

还有另一个关闭问题 – Musa

发生这种情况是因为变量c在每次迭代时都被重新分配。在for循环结束时，所有元素都会有一个适当的事件处理函数，但它们将在其函数体中引用相同的变量c。该变量将保留最后一个值c，即"c"。

一个解决办法是缓存在您指定每个函数处理一个封闭的c的价值，但在这种情况下，更好的做法是简单地使用this的处理程序中来指代由change针对性的select元素事件。

$(document).ready(function(){ 
    var NameOfSelect = ["a", "b", "c"]; 

    for (var i=0; i < NameOfSelect.length; i++) { 
     $("#"+NameOfSelect[i]).change(function() { 
      // this refers to the targeted select element 
      var select = this; 
      var str = ""; 
      $("option:selected", this).each(function() { 
       // this refers to the selected option 
       str += $(this).index() + " " + $(select).attr("id"); 
      }); 
      $("#output").text(str); 
     }).trigger("change"); 
    } 
});

而且，除非你使用select s的多种选择，应该只有一个option:selected每个select元素。因此，您可以仅使用find并与第一个（也是唯一的）选定的option一起使用。

var str = $("option:selected", this).index() + " " + $(this).attr("id"); 
$("#output").text(str);

来源

2012-06-22 13:19:20

这是好的，有效的。 – John

好醇'javascript关闭问题，我相信。分配给change事件的函数引用变量c，该变量对for循环的每次迭代都会更改，并以'c'结尾。相反，通过c进入该功能：

var c= NameOfSelect[i]; 
(function (n) { 
    $("#"+NameOfSelect[i]).change(function() { 
     var str = ""; 
     $("#"+n+" option:selected").each(function() { 
      str += $(this).index() + " "+$("#"+n).attr("id"); 
     }); 

     $("#output").text(str); 
    }).trigger('change') 
})(c);

来源

2012-06-22 13:20:42 Bort

太棒了。也有效。谢谢。 – John

使用数组作为动态JQuery字符串变量名称

回答

相关问题