agregando el evento onclick al botón agregado dinámicamente?

Question

añado un botón de forma dinámica en html, como a continuación: En clic del botón que quiero llamar a una función javascript:.

var but = document.createElement("button"); 

but.value="delete row"; 

but.setAttribute("onclick","callJavascriptFunction()"); 
//this is not working 

but.onclick="callJavascriptFunction()" 
//this is also not working 

document.getElementById("but").onclick="callJavascriptFunction()" 
//this is also not working 

but.id="but"+inc; 

¿Hay maneras de resolver esto ?? PLZ me ayude, gracias de antemano

Answer 1

probar esto:

but.onclick = callJavascriptFunction; 

o cree el botón envolviéndolo con otro elemento y utilizar innerHTML:

var span = document.createElement('span'); 
span.innerHTML = '<button id="but' + inc +'" onclick="callJavascriptFunction()" />'; 

Answer 2

Eliminar el() de sus expresiones que no están funcionando obtendrá los resultados deseados que necesita.

but.setAttribute("onclick",callJavascriptFunction); 
but.onclick= callJavascriptFunction; 
document.getElementById("but").onclick=callJavascriptFunction; 

Answer 3

but.onclick = callJavascriptFunction; 

sin comillas dobles no hay paréntesis.

Answer 4

Trate
but.addEventListener('click', yourFunction) Nota del ausencia de parantheses () después de la nombre de la función. Esto se debe a que está asignando la función, no llamándola.

Answer 5

Prueba esto:

var inputTag = document.createElement("div");    
inputTag.innerHTML = "<input type = 'button' value = 'oooh' onClick = 'your_function_name()'>";  
document.body.appendChild(inputTag); 

Esto crea un botón dentro de un DIV que funciona perfectamente!

Answer 6

Estaba teniendo un problema similar pero ninguna de estas correcciones funcionó. El problema era que mi botón aún no estaba en la página. La solución a este terminó siendo pasar de esto:

//Bad code. 
var btn = document.createElement('button'); 
btn.onClick = function() { console.log("hey"); } 

a esto:

//Working Code. I don't like it, but it works. 
var btn = document.createElement('button'); 
var wrapper = document.createElement('div'); 
wrapper.appendChild(btn); 

document.body.appendChild(wrapper); 
var buttons = wrapper.getElementsByTagName("BUTTON"); 
buttons[0].onclick = function(){ console.log("hey"); } 

no tengo ninguna pista en absoluto por qué esto funciona. Agregar el botón a la página y referirlo de otra manera no funcionó.

Answer 7

Este código funciona bien para mí y se ve más simple. Necesario para llamar a una función con un parámetro específico.

var btn = document.createElement("BUTTON"); //<button> element 
var t = document.createTextNode("MyButton"); // Create a text node 
btn.appendChild(t); 

btn.onclick = function(){myFunction(myparameter)}; 
document.getElementById("myView").appendChild(btn);//to show on myView 

Answer 8

but.onclick = function() { yourjavascriptfunction();};

o

but.onclick = function() { functionwithparam(param);};