Question

我无法点击onclick。我已经阅读了文档和其他几篇文章，但似乎没有任何帮助。有任何想法吗？感谢

    var inputDiv=document.createElement("div")
    inputDiv.className="form-grooup"

    var input=document.createElement("input")
    input.id="inputCommentField"
    input.class="form-contrrol"
    input.type="text"
    input.placeholder="Comments are anonymous"
    inputDiv.appendChild(input)

    actionDiv.appendChild(inputDiv)

    var commentButton=document.createElement("button")
    commentButton.id="sendButton"
    <!--    commentButton.type="button"-->
    commentButton.innerHTML="Reply"
    commentButton.onclick="comment();"
    inputDiv.appendChild(commentButton)

    var clearDiv=document.createElement("ul")
    actionDiv.appendChild(clearDiv)
    clearDiv.style="clear:both;"

评论（）的定义：

   function comment() {alert("you commented!")}

Answer 1

设置onclick DOM元素属性时，它采用函数引用，而不是字符串。 HTML属性采用字符串 - 这是独立的。

commentButton.onclick=comment;

像这样，我们通过引用传递comment函数onclick，这应该有效。

此外：

input.class="form-contrrol"

应为input.className。

和

<!--    commentButton.type="button"-->

这是JavaScript中的HTML注释。解决它。

//  commentButton.type="button"

Answer 2

如果您使用onclick作为属性

您必须指定一个功能参考：

commentButton.onclick = comment;

＆＃13;

function comment() {
  alert("you commented!");
}

var actionDiv = document.body,
  inputDiv = document.createElement("div");
inputDiv.className = "form-grooup";

var input = document.createElement("input");
input.id = "inputCommentField";
input.class = "form-contrrol";
input.type = "text";
input.placeholder = "Comments are anonymous";
inputDiv.appendChild(input);

actionDiv.appendChild(inputDiv);

var commentButton = document.createElement("button");
commentButton.id = "sendButton";

commentButton.innerHTML = "Reply";
commentButton.onclick = comment;
inputDiv.appendChild(commentButton);

var clearDiv = document.createElement("ul");
actionDiv.appendChild(clearDiv);
clearDiv.style = "clear:both;";

＆＃13;

如果您使用onclick作为属性

您必须指定一个字符串

commentButton.setAttribute('onclick', "comment();");

不推荐。 comment必须是全球函数。

＆＃13;

function comment() {
  alert("you commented!");
}

var actionDiv = document.body,
  inputDiv = document.createElement("div");
inputDiv.className = "form-grooup";

var input = document.createElement("input");
input.id = "inputCommentField";
input.class = "form-contrrol";
input.type = "text";
input.placeholder = "Comments are anonymous";
inputDiv.appendChild(input);

actionDiv.appendChild(inputDiv);

var commentButton = document.createElement("button");
commentButton.id = "sendButton";

commentButton.innerHTML = "Reply";
commentButton.setAttribute('onclick', "comment()");
inputDiv.appendChild(commentButton);

var clearDiv = document.createElement("ul");
actionDiv.appendChild(clearDiv);
clearDiv.style = "clear:both;";

＆＃13;

如果您使用addEventlistener

commentButton.addEventListener('click', comment);

这是最灵活的方式。

＆＃13;

function comment() {
  alert("you commented!");
}

var actionDiv = document.body,
  inputDiv = document.createElement("div");
inputDiv.className = "form-grooup";

var input = document.createElement("input");
input.id = "inputCommentField";
input.class = "form-contrrol";
input.type = "text";
input.placeholder = "Comments are anonymous";
inputDiv.appendChild(input);

actionDiv.appendChild(inputDiv);

var commentButton = document.createElement("button");
commentButton.id = "sendButton";

commentButton.innerHTML = "Reply";
commentButton.addEventListener('click', comment);
inputDiv.appendChild(commentButton);

var clearDiv = document.createElement("ul");
actionDiv.appendChild(clearDiv);
clearDiv.style = "clear:both;";

＆＃13;

Answer 3

您需要将onclick更新为

commentButton.onclick = comment;

这应该触发事件

onclick不叫html按钮

3 个答案: