javascript - 如何在onclick属性中传递 'this'等参数

Question

如何在 HTML onclick 属性中传递 DOM 元素和字符串:

<a href="javascript:;" onclick="load_page(this,'predictions')">

上面的代码调用了以下函数:

function load_page (_this,page) {
    console.log(_this); // 'predictions'
    console.log(page); // undefined
    $.ajax({
         type: "POST",
         //data: data,
         url: "/controller/"+page,
         success: function(response) {
             $("#page_content").html(response);
        },
        error: function(response, textStatus, errorThrown) { 
            console.log("Status: " + textStatus); 
            console.log("Error: " + errorThrown); 
            console.log(JSON.stringify(response));
        }  
    });
}

从代码注释中可以看到，参数变得困惑，其中一个显示为未定义。有任何想法吗？

Answer 1

您没有正确关闭“a”(它需要“/a”)，尽管我认为您正在寻找的不仅仅是这个答案，所以这是我的。

要将“this”以外的内容传递给函数，“最佳”方法是使用“data”；

<a href="javascript:;" data-something='predictions' onclick="load_page(this)">link</a>

检索数据:

function load_page (e) {
    console.log(e); 
    var something1 = e.dataset.something;
    console.log(something1);
 }

使用“数据”，您可以添加您喜欢的所有变量/信息。

我知道，在元素中使用“数据”和在函数中使用“数据集”看起来很奇怪，但这是 javascript 的奇怪之处之一。随着您的学习，您可以使用 jQuery，这使得记住命令变得更加简单。

有关 javascript 方式的更多信息，请访问 https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes