大佬教程收集整理的这篇文章主要介绍了JavaScript:将参数传递给onclick处理程序,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要将额外的参数传递给onclick处理程序.我无法确定哪种方式“更好”:
编辑:
上下文:我有一个表格,显示一个事件的名单.每行都有一个“删除”按钮.将recordId传递给delete-handler的更好方法是什么?
$('a.button').click(function() {
var recordId = $(this).Metadata().recordId;
console.log(recordId);
});
...
<tr>...<a class='{recordId:1} button'>delete</a></tr>
<tr>...<a class='{recordId:2} button'>delete</a></tr>
要么
function delete(recordId) {
console.log(recordId);
}
...
<tr>....<a class='button' onclick='deleteRecord(1)'>delete</a></tr>
<tr>....<a class='button' onclick='deleteRecord(2)'>delete</a></tr>
每种选择的优缺点是什么?
注意:我使用a.button作为自定义的CSS样式按钮,它不表现为链接.
编辑:
如果你可以论证所提供的替代品的优点,我也会感谢替代解决方案.
解决方法:
将记录ID存储为元素本身的属性,但不建议使用以奇怪格式存储的元数据插件,我建议您使用HTML5的数据属性,这些属性也是向后兼容的.
一行看起来像:
<tr> .. <a data-id="1">delete</a> .. </tr>
function deleteRecord() {
var rowId = $(this).attr('data-id');
...
}
它与使用元数据插件相当,但它不会重载class属性.这不需要额外的插件.它使用单个处理程序,正如元数据插件所做的那样,它对大型数据集具有高性能.
由于同样的原因,内联onclick处理程序很糟糕.每行创建一个新的处理程序.它降低了灵活性,通常是一种不好的做法.
以上是大佬教程为你收集整理的JavaScript:将参数传递给onclick处理程序全部内容,希望文章能够帮你解决JavaScript:将参数传递给onclick处理程序所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。