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

Question

  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

谢谢！

Answer 1

querySelector 返回一个 DOM 对象。 .on 函数是一个 jQuery 函数。你需要把它包装起来：

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

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