javascript - 如何使用 href 和 onclick 函数传递参数

Question

我想在点击<a href>时传递参数，首先我有这个并且工作正常:

    <a href="#" rel="like{{num}}"> I like </a>|

   $("a[rel^='like']").click(function(){
            $.ajax({
                ...
            });

但我不知道如何将参数传递给该函数，所以我这样做:

    <a href="#" rel="like{{num}}"
          onclick="cap(para1, para2)"> I like </a>

最后，在我的 Javascript 中我有这个简单的功能:

    function cap(para1, para2){
        alert('here');
    }

但我得到这个错误:

ReferenceError: cap is not defined

有什么想法吗？

Answer 1

解决方案是使用 data attributes :

<a href="#" rel="like{{num}}" data-para1="Oh"  data-para2="{{somepara}}"> I like </a>

<script>
function cap(para1, para2){
    alert('here');
}
$("a[rel^='like']").click(function(){
   var para1 = this.dataset['para1'];
   var para2 = this.dataset['para2'];
   cap(para1, para2);
});
</script>

如果你喜欢更结构化的方法，你也可以这样写:

<a href="#" rel="like{{num}}" data-params="{'para1':'Oh','para2':'{{somepara}}'}"> I like </a>

$("a[rel^='like']").click(function(){
   var params = this.dataset['params'];
   var para1 = params.para1;
   var para2 = params.para2;

请注意，如果文档不是 HTML5 文档，您将不得不使用更兼容的 data function of jQuery (但今天几乎没有任何理由不使用 HTML5 文档类型):

var para1 = this.data('para1');