Question

 <td><img 
    name="Brown Corkboard"
    title="800.00"
    id="nikolas"
    src="materials/corkboardtexture.png"
    alt="600"
    onclick="reply_click(this.src,this.name,this.title,this.alt)"
    width="200"
    height="150"

我在HTML表格中有这个图像。我使用attribues标题和alt来指定执行单击图像时调用的函数所需的一些值。

我必须走错路。我想在点击图像时向我的函数发送许多不同的变量。但是我没有选项，因为我已经用完了title属性和alt属性。有什么建议吗？

Answer 1

您可以添加所需的任意属性，并将其用作参数。

<img data-count="1" data-tree="oak" ... onclick=('reply_click(this);')>

或者你喜欢什么。

function reply_click(clicked_thing) {
    var tree = clicked_thing.getAttribute('data-tree');
    console.log(tree);
}

通常我不会在我的图片代码中使用onclick，而是使用javascript将函数绑定到事件。

Answer 2

这些天的标准是data-*，例如：

<tr data-id="6"><td data-desc="Test blah blah blah">Test</td></tr>
<tr data-id="7"><td data-desc="Gary the disabled penguin">Gary</td></tr>

是常用的。这取决于您的确切需求，但我通常会建议数据属性

Answer 3

正如其他人所回复的那样，如果你需要在HTML属性中携带任意数据，data-属性就是的方法。 alt和title属性根本不应用于此类目的，因为这会干扰已定义的含义和这些属性的使用。

该示例未显示任何原因导致您无法简单地将数据作为参数写入函数调用中，例如onclick="reply_click(this.src, this.name, 800.00, 600)。

或者您可以在DOM内部或外部的JavaScript对象中编写数据，并使您的函数可以使用例如id属性值作为键。

标记内的附加属性，用于将值传递给函数

3 个答案: