jQuery更新选择列表

我有一个表单，用户可以提交表单以指示需要更新的系统。 在表单中，他们可以动态地将表单添加到表单中，因此我没有可用的唯一ID。 在表单中，他们必须选择一个平台（unix，hp，wintel等），然后选择相应的模型来选择平台 – 想想链式选择。 当更改“项目”中的第一个选定列表时，进行ajax调用以获取第二个选择列表的值。 如何仅为相应的链接选择更新“项目”中的第二个选择列表？

我正在使用克隆方法允许用户向表单添加项目。 因此，id在页面上不再是唯一的，所以我正在使用该类来确定哪个选择按钮发生了变化。 它现在的工作方式，每个第二个选择列表都会更新，我只希望更新第一个选择列表对应的选择链式选择列表。 我相信next（）就是答案，但我猜我的语法不正确。

第一个选择列表的类是平台，第二个是模型。

更新每个第二个选择列表 ：$（“select.model”）。html（选项）

没有更新 ：$（“select.model”）。next（）。html（options）;

任何帮助，将不胜感激。

  1 2 3   1 2 3  
 
  1 2 3   1 2 3  
  jQuery(document).ready(function() { $(".myFirstOption").live("change", function() { $.getJSON("live_getModels.cfm",{platform: $(this).val()}, function(j){ var options = ''; for (var i = 0; i < j.length; i++) { options += '' + j[i].optionDisplay + ''; } $(this).next("#mySecondSelect").html(options); }); }); });  

这里有一个示例JSON结果，用于更准确的演示：

 [{"optionValue":"", "optionDisplay":"Select Model"},{"optionValue":"TBD", "optionDisplay":"TBD"},{"optionValue":"SCCM", "optionDisplay":"SCCM-standalone"},{"optionValue":"Manual", "optionDisplay":"Manual-standalone"},{"optionValue":"SCCM-VMWare", "optionDisplay":"SCCM-VMWare"},{"optionValue":"Manual-VMWare", "optionDisplay":"Manual-VMWare"},{"optionValue":"SCCM Hybrid", "optionDisplay":"SCCM Hybrid"},{"optionValue":"SCCM Hybrid VMWare", "optionDisplay":"SCCM Hybrid VMWare"},{"optionValue":"SCCM Offline", "optionDisplay":"SCCM Offline"},{"optionValue":"SCCM Offline - VMWare", "optionDisplay":"SCCM Offline - VMWare"}] 

Answer 1

如果我正确阅读，.next（）无效的原因是因为您选择了要更新的下拉列表，然后转到下一个。 如果你的（伪）html看起来像这样

 
  1   2   

并且您有第一次选择代码的更改事件

 $(this).next("#mySecondSelect").options(html); 

---

根据您的编辑，将您的JavaScript更改为：

 jQuery(document).ready(function() { $(".myFirstOption").live("change", function() { var firstOption = $(this); $.getJSON("live_getModels.cfm",{platform: $(this).val()}, function(j){ var options = ''; for (var i = 0; i < j.length; i++){ options += '' + j[i].optionDisplay + ''; } firstOption.next("#mySecondSelect").html(options); }); }); }); 

我相对确定ajax成功函数this = window，所以你必须保存对原始对象的引用。

Answer 2

为什么不让用户填写包含所有信息的表单，并将它们仅在末尾附加到列表中？

这样你就不必担心有n个下拉菜单了。