Question

我正在尝试创建一个链接，其外观和感觉类似于<a>标记项，但运行函数而不是使用href。

当我尝试将onclick函数应用于链接时，它会立即调用该函数，而不管链接是否从未被点击过。此后任何单击链接的尝试都将失败。

我做错了什么？

HTML

<div id="parent">
    <a href="#" id="sendNode">Send</a>
</div>

的Javascript

startFunction();

function secondFunction(){
    window.alert("Already called!?");
}

function startFunction() {
    var sentNode = document.createElement('a');
        sentNode.setAttribute('href', "#");
        sentNode.setAttribute('onclick', secondFunction());
      //sentNode.onclick = secondFunction();
        sentNode.innerHTML = "Sent Items";

    //Add new element to parent
    var parentNode = document.getElementById('parent');
    var childNode = document.getElementById('sendNode');
    parentNode.insertBefore(sentNode, childNode);
}

JsFiddle

正如你所看到的，我尝试了两种不同的方法来添加这个onclick函数，两者都具有相同的效果。

Answer 1

您想要.onclick = secondFunction

不 .onclick = secondFunction()

后者调用（执行）secondFunction，而前者传递对secondFunction事件的onclick的引用

＆＃13;

function start() {
  var a = document.createElement("a");
  a.setAttribute("href", "#");
  a.onclick = secondFunction;
  a.appendChild(document.createTextNode("click me"));
  document.body.appendChild(a);
}

function secondFunction() {
  window.alert("hello!");
}

start();

＆＃13;

您也可以使用elem#addEventListener

a.addEventListener("click", secondFunction);

// OR

a.addEventListener("click", function(event) {
  secondFunction();
  event.preventDefault();
});

立即调用Javascript onclick函数（不是在点击时）？

1 个答案: