javascript - jQuery 选择器 不能选择匿名函数里创建的jquery对象吗？

Question

 function init() {
   $('.new_button').click(function () {
    var $html = $( 
  '<p class="new_con">' + 
    ' <p class="con con1"> ' +
          ' <input type="text" value="这里是标题" onclick="this.select()"/> ' +
    '</p>' +

    '<p class="con con2">' +
          '<p class="add_qs">+     添加问题</p>' +
    '</p> '  +

     
    '<p class="con3">' +
          '<span>问卷截止日期 &nbsp <input type="text"  id="calendar" /> </span>' +
          '<span class="btn sav_btn" >保存问卷</span>' +
          '<span class="btn rel_btn">发布问卷</span>' +
     '</p>' +
'</p>'
);
    $('.con_bg').empty().append($html)

      });  

⑨

 $(".con1 input[type=text]").keydown(function (e) {
      console.log(e.target)
      if(e.keyCode == 13) {
          console.log(e.keyCode)
          $(this).blur();
      }
  })

事实证明⑨这一段完全没有作用，但是如果不是访问里面的对象的话，比如$('body')却是可以做选择器来访问的。
讲道理的话，即便$html 是局部变量但是已经被添加进入了dom里面，应该可以访问啊？

Answer 1

问题出在这里：这个keydown事件在绑定时，.con1这个元素还不在DOM中。为了实现对页面第一次渲染完成之后被js动态生成的元素做事件绑定，要用jquery的on()方法：

$(".con1 input[type=text]").on('keydown', function (e) {
      console.log(e.target)
      if(e.keyCode == 13) {
          console.log(e.keyCode)
          $(this).blur();
      }
  })

Answer 2

$(".con_bg").on('keydown', 'input[type=text]', function (e) {
  console.log(e.target)
  if(e.keyCode == 13) {
      console.log(e.keyCode)
      $(this).blur();
  }
})

Answer 3

要有效果的前提条件:
.con1 input[type=text]这个元素必须存在，事件回调注册才能成功，相应的事件回调在keydown事件发生后被执行

1种采用 @林岑影 的方法，使用事件代理机制
第2种方法，在.new_button的click事件回调函数中注册

function init() {
   $('.new_button').click(function () {
    var $html = $( 
  '<p class="new_con">' + 
    ' <p class="con con1"> ' +
          ' <input type="text" value="这里是标题" onclick="this.select()"/> ' +
    '</p>' +

    '<p class="con con2">' +
          '<p class="add_qs">+     添加问题</p>' +
    '</p> '  +

     
    '<p class="con3">' +
          '<span>问卷截止日期 &nbsp <input type="text"  id="calendar" /> </span>' +
          '<span class="btn sav_btn" >保存问卷</span>' +
          '<span class="btn rel_btn">发布问卷</span>' +
     '</p>' +
'</p>'
);
    $('.con_bg').empty().append($html);
    addCon1KeyDownListener();
});  

function addCon1KeyDownListener(){
    $(".con1 input[type=text]").keydown(function (e) {
      console.log(e.target)
      if(e.keyCode == 13) {
          console.log(e.keyCode)
          $(this).blur();
      }
  });
}