嵌套的“on”单击和按键功能不起作用

Nested 'on' click and keypress functions not working?

本文关键字:功能 不起作用 单击 on 嵌套      更新时间:2023-09-26
  element.on("click", function(){
    element[0].querySelector("input").focus()
    element[0].querySelector("input").on('keypress',function(key){
        console.log(key)
    }
  })

这将返回此错误:

Uncaught TypeError: undefined is not a function 
runner:18(anonymous function) 
runner:18(anonymous function) 
angular.js:2843forEach 
angular.js:325eventHandler

和JSBin

谢谢!

querySelector 返回一个 DOM 对象。.on函数是一个jQuery函数。您需要包装它:

$(element[0].querySelector("input")).on('keypress',function(key){
    console.log(key)
}

另外,我会厌倦在其他事件处理程序中添加事件处理程序。每当您单击该元素时,都会添加按键事件。如果单击元素 5 次,输入现在将有 5 个活动的按键事件,除非您在某个时候将其删除。只有当你意识到这些影响时,你才应该这样做 - 即使这样,它也会使代码难以理解。