how to create <input onchange='myFunction()' /> dynamically with function

Question

I know that you can use document.createElement for this but I get a domexception from doing this:

document.createElement("<input onchange='myFunction()' />");

Error:

Uncaught DOMException: Failed to execute 'createElement' on 'Document': The tag name provided ('<input onchange='myFunction()' />') is not a valid name.

Do you know how to create an element dynamically with a function?

RenaudC5 · Accepted Answer · 2022-05-13 09:19:57Z

1

You should make it in 3 times :

First creating the element
Then adding the function
Finally adding it to the dom

const myFunction = () => {
  console.log("hello world")
}

const btn = document.createElement('button')
btn.innerText = "MyBtn"
btn.addEventListener('click', myFunction)
document.body.appendChild(btn)

answered May 13, 2022 at 9:19

RenaudC5

3,8591 gold badge13 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Iskooolar2 iskoolar2 · Accepted Answer · 2022-05-13 09:19:31Z

0

Sorry I was too quick to ask for help. But this is the answer:

newInput3.onchange = myFunction;

myFunction should not be an actual string.

answered May 13, 2022 at 9:19

Iskooolar2 iskoolar2

197 bronze badges

Collectives™ on Stack Overflow

how to create <input onchange='myFunction()' /> dynamically with function

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related