0

这是我用来创建按钮的代码:

var dfom = document.createElement('div');
dfom.setAttribute("id","options");
dfom.innerHTML = "<input type=\"button\" value=\"Say HI\" onclick=\get()\ />";
dfom.style.padding = '10px';
document.body.insertBefore(dfom, document.body.firstChild);

按钮创建得很好;它显示正确。所以为了测试它,我这样做了:

function get()
{
alert("HI");
}

但是,当我单击按钮时,什么也没有发生。请问有什么帮助吗?谢谢!

4

4 回答 4

1

如果你想编写正确的 JavaScript 代码,那么你应该这样做:

var dfom = document.createElement("div"),
    button = document.createElement("input");

button.type = "button";
button.value = "Say HI";
button.addEventListener("click", function() {
    alert("HI");
}, false);

dfom.id = "options";
dfom.style.padding = "10px";
dfom.appendChild(button);

document.body.insertBefore(dfom, document.body.firstChild);

演示:http: //jsfiddle.net/TKdYh/

于 2013-03-26T22:53:11.483 回答
1

\应该是\"around get(),但还有更多考虑:即该函数get实际上必须在外部onload或另一个回调中定义,因为它需要全局可用。你需要一个类似这样的设置:

http://jsfiddle.net/CZ2y4/

...它get在回调之外定义onLoad,使其可用于onclick.

此外,使用标准事件绑定而不是onclick

dfom.innerHTML = "<input type=\"button\" value=\"Say HI\">";
dfom.firstChild.addEventListener('click', get);

http://jsfiddle.net/CZ2y4/1/

于 2013-03-26T22:57:18.503 回答
1

函数名也应该用引号括起来,即onClick="get();". 还可以在有时间的时候阅读事件监听器,例如此处

于 2013-03-26T22:42:40.687 回答
0

以下对我有用:

window.onload = function() {
  var dfom = document.createElement('div');
  dfom.id = "options";
  dfom.innerHTML = '<input type="button" value="Say HI" onclick="get()">';
  dfom.style.padding = '10px';
  document.body.insertBefore(dfom, document.body.children[0]);
}

function get() {
  alert("HI");
}

需要注意的一些事项:

  1. 对于标准的 DOM 属性,通常最好只设置属性,不要使用 setAttribute,因为它的实现不一致。

  2. 对脚本使用单引号和对 makrup 使用双引号会更清楚,这样您就不必使用尽可能多的反斜杠来引用引号

  3. 严格来说,HTML 属性值只有在它们包含某些字符时才需要被引用。将它们全部引用而不是记住那组字符是什么更容易。浏览器也非常宽容,因此您可以摆脱应该在某些浏览器中引用但在其他浏览器中不应该引用的未引用字符。

于 2013-03-26T23:02:36.803 回答