jQuery .on()单击事件捕获按钮列表中的动态“data-”属性将值传递给其他函数? [英] jQuery .on() click event catching dynamic 'data-' attribute in list of buttons to pass value to other function?
问题描述
我有一个大约40行的动态表列表,其中包含一个包含日期字段的编辑按钮。
我还有以下点击事件脚本尝试通过一个通用类附加到每个按钮,该类需要访问下面进一步的按钮图像代码中的数据属性的值:
I have a dynamic table list of around 40 rows each with an edit button containing a date field. I also have the following click event script trying to attach to each button via a common class which needs to access the value of a data- attribute within the button image code seen further below:
$('.showEdt').each(function () {
var $this = $(this);
$(this).on("click",$this.data('eValz'), function () {
alert(this);
});
});
动态生成的编辑按钮示例:
Example of the edit buttons which are dynamically generated:
<img src="edit.png" title="edit" class="showEdt" data-evalz="(eyCKeVua/TNF117)" />
问题:
脚本加载好当点击编辑按钮时,警报显示:
[object HTMLImageElement]而不是data-evalz值?
Problem:
The script loads ok, when the edit button is clicked the alert displays: [object HTMLImageElement] instead of the data-evalz value ??
请提供我如何访问点击的按钮唯一的数据?
Please provide suggestions of how I can access the data unique to the button that is clicked?
推荐答案
您没有正确使用功能的。以下是一种方法: FIDDLE
You're not using the on
function correctly. Here's one way you can do this: FIDDLE
$('.showEdt').each(function () {
var $this = $(this);
$this.on("click", function () {
alert($(this).data('evalz'));
});
});
另外,注意你写的 eValz
而不是代码上的 evalz
。数据属性区分大小写,请注意如何编写它们。
Also, notice you've written eValz
instead of evalz
on your code. Data attributes are case-sensitive so be careful with how you write them.
这篇关于jQuery .on()单击事件捕获按钮列表中的动态“data-”属性将值传递给其他函数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!