Javascript 无法使用document.getElementById（'password'）.addEventListener（）和webpack&ES6设置调用函数_Javascript_Webpack_Ecmascript 6_Addeventlistener_Es6 Class

Javascript 无法使用document.getElementById（'password'）.addEventListener（）和webpack&ES6设置调用函数

javascript webpack ecmascript-6

Javascript 无法使用document.getElementById（'password'）.addEventListener（）和webpack&ES6设置调用函数,javascript,webpack,ecmascript-6,addeventlistener,es6-class,Javascript,Webpack,Ecmascript 6,Addeventlistener,Es6 Class,我正在使用webpack和ES6课程。我试图在inputpassword上调用“onblur”函数，但它不起作用。它既不抛出任何错误，也不调用回调函数。如果我尝试使用console.logdocument.getElementById'password'在eventListener外部查找inputpassword，那么它会将inputpassword作为DOM对象提供给我。我不知道我在这件事上哪里出了问题。下面是我的代码： index.html <head> &

我正在使用webpack和ES6课程。我试图在inputpassword上调用“onblur”函数，但它不起作用。它既不抛出任何错误，也不调用回调函数。如果我尝试使用console.logdocument.getElementById'password'在eventListener外部查找inputpassword，那么它会将inputpassword作为DOM对象提供给我。我不知道我在这件事上哪里出了问题。下面是我的代码：

index.html

    <head>
      <script src="./bundle.js"></script>
    </head>
    <body>
       <input id="password" type="password" placeholder="Please enter your password" autofocus="autofocus">
    </body>

index.js

import { Password } from './app/main';

document.getElementById('password').addEventListener('onblur', () => {
    console.log('im here');
    var initPwd = new Password();
    initPwd.init();
})

main.js

class Password {
    init() {
        console.log('I am inside init.')
    }
}

export { Password }

请帮忙

document.getElementById('password').addEventListener('onblur', () => {

onblur将与element.onblur=函数{}一起使用，因此当您使用addEventListener接口时，不应在事件名称中写入

onblur将与element.onblur=函数{}一起使用，因此当您使用addEventListener接口时，不应在事件名称中写入。问题是事件名称是blur，而您可以通过指定元素的onblur属性来指定处理程序。它们不一样，这可能会让人有点困惑

通过指定属性来附加侦听器时，使用.on语法，例如：

element.onclick = () => ...
element.onblur = () => ...

使用addEventListener时，只需使用普通事件名称：

element.addEventListener('click', () => ...
element.addEventListener('blur', () => ...

因此，请改为：

document.getElementById('password').addEventListener('blur', () => {

document.getElementById'password'。addEventListener'blur'，=>{ console.log'blur'； }; 问题是事件名称是blur，而您可以通过指定元素的onblur属性来指定处理程序。它们不一样，这可能会让人有点困惑

通过指定属性来附加侦听器时，使用.on语法，例如：

element.onclick = () => ...
element.onblur = () => ...

使用addEventListener时，只需使用普通事件名称：

element.addEventListener('click', () => ...
element.addEventListener('blur', () => ...

因此，请改为：

document.getElementById('password').addEventListener('blur', () => {

document.getElementById'password'。addEventListener'blur'，=>{ console.log'blur'； };

谢谢你的解决方案。谢谢你的解决方案。当一个答案解决了你的问题时，考虑一下投票并把它标记为被接受来表明问题已经解决了：谢谢你的解决方案。当一个答案解决了你的问题时，考虑一下投票，并把它标记为接受，以表明问题已经解决了：