JS使用不同的方法设置点击属性

JS Setting onclick attribute using different methods

本文关键字：设置 属性 方法 JS      更新时间：2023-09-26

我正在尝试将onclick属性设置为锚点，如下所示：

$("a").click(function(e) {
    $(this).onclick = "ItWorks";
    output = "JS onclick attempt: my onclick is: <strong>" + $(this).onclick + "</strong>";
    $(this).prop("onclick", "ItWorks");
    output += "<br />jQuery prop() attempt: my onclick is: <strong>" + $(this).prop("onclick") + "</strong>";
    $(this).attr("onclick", "ItWorks");
    output += "<br />jQuery attr() attempt: my onclick is: <strong>" + $(this).attr("onclick") + "</strong>";
    alert(output);
    e.preventDefault();
});

我尝试过纯JS，jQuery prop（）和attr（）函数。正如你在这个例子中看到的，只有.attr（）函数正常工作。

有人可以告诉我其他两次尝试返回"null"或"未定义"时我做错了什么吗？

$(this).onclick = "ItWorks";

在 JQuery 对象上设置属性，而不是在 DOM 节点上设置属性。

$(this).prop("onclick", "ItWorks");

将属性设置为字符串，但它需要一个函数...并且该属性不会像其他某些属性那样直接映射到属性值。

$(this).attr("onclick", "ItWorks");

将属性设置为字符串，尽管在作为 JS 执行时不会执行任何操作。

如果要设置事件处理程序并使用 jQuery，请使用 on 方法，并且不要尝试通过检查属性值来测试它。

为什么不让它变得更容易： 

<a href="javascript:void(0)" onclick='clickEvent("a")'>link</a>
<a href="javascript:void(0)" onclick='clickEvent("a")'>link</a>
function clickEvent(event)  {
   if (event == "a") {
     output = "event a clicked";
   } elseif (event == "b") {
     output = "event b clicked";
   }
   alert(output);
}
相关文章：