我正在构建一个HTML表单,对于其中的一部分,div中的一组HTML输入字段需要被推送到一个数组。 div和所有字段在创建时都会获得唯一的ID /名称 - 特别是其中一个输入是选择。
所有这些工作正常 - 字段被创建并推送到数组,所有内容都正确,等等,但我似乎无法访问应该更晚的jQuery更改函数的select元素,在创建字段后。我测试了一个内联的Javascript“onchange = myFunction()”类型的东西,这能够访问select元素 - 我知道这是有效的,但它不会是一个可接受的解决方案...我真的需要使用$ (“#id”)。改变功能。
如何使用jQuery访问存储在数组中的select元素?
this['input_array' + siteName] = [];
for (y = 0; y < numberFound; y++){
this['input_array' + siteName].push('<div id="'+routeValue+''+siteName+'Details'+y+'" class="details">Species: <select id="'+siteName+'Species'+y+'" name="species['+y+']" data-speciesNumber="'+y+'">'+speciesList+'</select></div>);
$("#"+siteName+"Species"+y+"").change(function(){
species = this.value;
speciesNumber = this.getAttribute("data-speciesNumber");
siteSpeciesNumber = displayName + "" + species + "" + speciesNumber;
document.getElementById(""+siteName+"compileField"+speciesNumber+"").value = siteSpeciesNumber;
});
};
$("#"+routeValue+""+siteName+"Details").append(this['input_array' + siteName]);
答案 0 :(得分:1)
问题不在于选择是在一个数组中,而是它还没有附加到DOM。
尝试将事件处理程序作为元素的一部分附加。现在,当jQuery将元素插入到文档中时,会注册事件绑定。
function $newSelect(y) {
return $('<select />', {
html: speciesList,
id: siteName + 'Species' + y,
name: 'species[' + y + ']',
data: {
speciesNumber: y
},
on: {
change: function(){
species = this.value;
speciesNumber = this.getAttribute("data-speciesNumber");
siteSpeciesNumber = displayName + "" + species + "" + speciesNumber;
document.getElementById(""+siteName+"compileField"+speciesNumber+"").value = siteSpeciesNumber;
}
}
}
}
function $newField (idNum) {
return $("<div id="'+routeValue+''+siteName+'Details'+y+'" class="details"></div>", {
html: $newSelect(idNum)
});
}
this['input_array' + siteName] = [];
for (y = 0; y < numberFound; y++){
this['input_array' + siteName].push($newField(y));
};
$("#"+routeValue+""+siteName+"Details").append(this['input_array' + siteName]);