嵌套＆＃39; on＆＃39;点击和按键功能不起作用？

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)
}

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