如何在jQuery中处理动态ID
我有点困惑于如何处理以下问题我能想到的唯一解决方案是手工编写每一个此类事件的代码,但这不是可伸缩的/实用的,因为页面可能是动态的-这是原始jQuery代码,它处理的表单ID非常简单,效果很好:如何在jQuery中处理动态ID,jquery,Jquery,我有点困惑于如何处理以下问题我能想到的唯一解决方案是手工编写每一个此类事件的代码,但这不是可伸缩的/实用的,因为页面可能是动态的-这是原始jQuery代码,它处理的表单ID非常简单,效果很好: $('#resultTable').on("click", "#frm", function() { $('#updateButton').show(); $("#suc
$('#resultTable').on("click", "#frm", function() {
$('#updateButton').show();
$("#successStr").empty();
});
但是,如果我想要有多个表单,每个表单都有自己的ID,例如,frm1,frm2等,并且动态地将ID后缀1,2等作为子/关联ID的一部分,该怎么办?类似于此Resultable的内容有多个表单,每个表单都有一个更新按钮,等等:
$('#resultTable').on("click", "[id^='frm']", function() {
$('#updateButton'+XXX).show();
$("#successStr"+XXX).empty();
});
其中XXX是来自父frmID编号的后缀ID编号,可能用于捕获上的父frmID编号的正则表达式样式
任何关于如何处理的提示都将不胜感激
感谢您在表单中使用frm,在控件中使用updateButton,即 frm_1=>updateButton_1,frm_2=>updateButton_2
$('#resultTable').on("click", "[id^='frm_']", function() {
$('#updateButton_'+ $(this).attr("id").split("frm_")[1]).show();
$("#successStr_"+ $(this).attr("id").split("frm_")[1]).empty();
});
您没有显示HTML标记,但下面的解决方案只需稍作调整即可适应当前布局:
$function{
//单击class=myForm的任何窗体时
$'Resultable'.onclick、.myForm、函数{
//查找class=myUpdateButton的按钮
//在此表格内
$'.myUpdateButton',$this.show;
//查找class=mySuccessStr的元素
//在此表格内
$'.mySuccessStr',$this.empty;
};
};
/*就拿这个例子来说*/
.我的表格{
边框:1px000;
}
/*按钮首先将被隐藏*/
.myUpdateButton{
显示:无;
}
使现代化
成功
使现代化
成功
为表单提供一个共享类,并使用该类作为选择器附加事件处理程序。在处理程序中,$将是接收事件的元素。要链接到其他元素,请给它们一个数据属性,每个元素都有特定的内容。您可以在所有表单上使用类而不是ID,并添加数据属性。数据IDXXXI如果您向我们展示HTML标记,那么就更容易给出更好的建议。这些其他元素是否在表单中?如果是这样的话,$this.find'some-selector-here'会抓住它们。这个选择器可以是一个共享类。因此,没有更多的ID需要关注。如果有可变数量的FRM,这会起作用吗?今天可能有5个,但六个月后可能有200个。。。我无法编辑代码,它需要动态处理。如果所有表单和匹配的子元素都遵循相同的id格式,那么应该这样做。id格式中的一个更改会使整个过程停止工作,这让我感到害怕。但是,我提出的第二种解决方案也会遇到同样的情况。不管你选择哪一种,无论是相同的ID格式,还是使用数据属性,或者是依赖于类名,如果任何一种格式发生变化,它都有可能在某一天停止工作。因此,您需要选择最不可能的一个,它也将为您提供您现在需要的结果。正确-那么这可能是最短的解决方案,也不需要我更改为类,等等。嗯,我喜欢您的第一个建议,因为它很简单,即使我的程序员想要使用数据属性。。。让我试一试——它看起来应该可以动态地处理任意数量的表单。是的,你会倾向于使用第二个表单,但我认为你应该尽可能地保持它的简单。维护代码将更加容易:多亏了你,伙计,你给我展示了一些额外的东西,并提醒了我一些我以前从未使用过的数据,但我只知道在不久的将来会用到。助教!