javascript – jquery – 将参数传递给函数

这似乎是一个简单的问题,但我找不到一个简单的答案.所以我先从一个简单的例子开始.

<a href="#" onclick="showmsg('bark')">dog</a>
<a href="#" onclick="showmsg('meow')">cat</a>

这是一个javascript函数…

function showmsg(msg) {
  alert(msg);
}

在上面的示例中,可以添加附加内容(html行)而不会破坏行为(javascript).每行html都将自己的参数传递给javascript,告诉它应该显示哪条消息.

如果html改为……

<a href="#" class="showmsg">dog</a>
<a href="#" class="showmsg">cat</a>

那么我该如何编写一个知道单击哪一行html的jquery函数呢?换一种说法…

如何将参数传递给jquery函数?

最佳答案
在这种情况下,我会使用data- attribute,如下所示:

<a href="#" class="showmsg" data-sound="bark">dog</a>
<a href="#" class="showmsg" data-sound="meow">cat</a>

你的点击处理程序可以获取它,如下所示:

$("a.showmsg").click(function() {
  alert($(this).attr("data-sound"));
});

或者在jQuery 1.4.3中

$("a.showmsg").click(function() {
  alert($(this).data("sound"));
});

You can test it out here.

根据评论澄清:这在HTML5中是完全有效的,在HTML4中它无效,但验证器是您将拥有的唯一问题,它可以在每个HTML4浏览器中使用.如果它在HTML4中没有遗漏,那么它就不会被添加到HTML5中……无论是否验证,我都会亲自使用它.

转载注明原文:javascript – jquery – 将参数传递给函数 - 代码日志