Javascript 使用javascript将事件添加到按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2199949/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Add event to button with javascript
提问by SlimBoy
In this page there's a way to dynamic add html (textbox,input button and radio elements with javascript
在此页面中，有一种方法可以 动态添加 html（文本框、输入按钮和带有 javascript 的单选元素
my questioon is how can i add an event to the button, imagine that i only want create the button, not the textbox or the radio element.
我的问题是如何向按钮添加事件，想象一下我只想创建按钮，而不是文本框或单选元素。
UPDATE
I'm having problems here... I have tried some of the solutions provided but it causes me problems, let me try to explain...
更新
我在这里遇到问题......我已经尝试了一些提供的解决方案，但它给我带来了问题，让我试着解释......
im trying to open xml file, read it and create html object with the properties of the xml, so far so good, but if i try to add the event, xmlObj cames null any ideias??
我正在尝试打开 xml 文件，读取它并使用 xml 的属性创建 html 对象，到目前为止还不错，但是如果我尝试添加事件，xmlObj 会为空吗？
i have this...
我有这个...
script = "function OnClientDragEnd(dock, args)" +
" {" +
"var hidd = document.getElementById('" + HiddenField1.Value + "');" +
"hidd.value = dock.get_id();" +
//"alert(hidd.value);" +
"var xmlDoc = new ActiveXObject('Microsoft.XMLDOM');" +
"xmlDoc.async = 'false';" +
"xmlDoc.load('Config.xml');" +
"xmlObj = xmlDoc.documentElement;" +
"if (xmlObj.childNodes.length>0)" +
"{" +
" for (var i = 0; i < xmlObj.childNodes.length; i++)" +
" {" +
" if (xmlObj.childNodes(i).getElementsByTagName('Id')[0].text == hidd.value){" +
" var txtTb2 = document.getElementById('" + TextBox4.ClientID + "');" +
" txtTb2.value = xmlObj.childNodes(i).getElementsByTagName('Titulo')[0].text;" +
" y = xmlObj.childNodes(i).getElementsByTagName('Titulo')[0].nextSibling;" +
" yy = xmlObj.childNodes(i).getElementsByTagName('Titulo')[0].previousSibling;" +
//" alert(y.nodeName);" +
" for(i=0;i<yy.text;i++){" +
" alert('aa');" +
" var tbox = document.createElement('input');" +
" tbox.setAttribute('type', 'text');" +
" tbox.setAttribute('value', y.text);" +
" tbox.setAttribute('name', 'name');" +
" var abcd = document.getElementById('spanObjDock');" +
" abcd.appendChild(tbox);" +
" var bt1 = document.createElement('input');" +
" bt1.setAttribute('name', 'mais');" +
" bt1.setAttribute('value', '+');" +
" bt1.setAttribute('type', 'button');" +
" bt1.onclick = function (){alert('Clicked!');};" + //--> this dont work
//" bt1.setAttribute('Click','addRadioButton()');" + //--> and this dont work
" abcd.appendChild(bt1);" +
" var bt2 = document.createElement('input');" +
" bt2.setAttribute('name', 'menos');" +
" bt2.setAttribute('value', '-');" +
" bt2.setAttribute('type', 'button');" +
" abcd.appendChild(bt2);" +
" var break1 = document.createElement('br');" +
" abcd.appendChild(break1);" +
" node = y;" +
" y=y.nextSibling;" +
" }" +
" break; " +//<input type="button" onclick="" name"as" />
" }" +
" }" +
"}" +
"}";//+
回答by Crozin
Simply, use addEventListenermethod:
简单来说，使用addEventListener方法：
buttonRef.addEventListener("click", function() {
alert("Blah blah...");
}, false);
(You'll have to Google for cross-browser solution. IE doesn't support addEventListener)
（你必须谷歌跨浏览器解决方案。IE不支持addEventListener）
Where buttonRefis a reference to button. How can you get that reference? There's lots of ways to do that. You can use document.getElementById()or any other method from this "family".
buttonRef对按钮的引用在哪里。你怎么能得到那个参考？有很多方法可以做到这一点。您可以使用document.getElementById()此“家庭”中的 或 任何其他方法。
回答by Max Shawabkeh
var element = document.createElement("input");
element.onclick = function() {alert('Clicked!');};
回答by Andy E
Probably the easiest cross-browser way is to set the event name as a property of the element:
可能最简单的跨浏览器方法是将事件名称设置为元素的属性：
Element.onclick = function ()
{
// do something...
}
Element.onmouseup = function ()
{
// do something else...
}
回答by Boris Guéry
You have to attach the new event when creating the DOM element.
您必须在创建 DOM 元素时附加新事件。
For example :
例如 ：
var e = document.createElement('input');
e.onclick = function()
{
alert('Test');
};
