jQuery最后一个子选择器不是＆＃34;刷新＆＃34;

Question

在页面的最后一个textarea框中，调用一个函数来插入另一个textarea框。使它成为新的最后一个textarea，然而jQuery并不认为这个textarea是新的最后textarea。

该功能贴在通过html插入的最后一个textarea上。

function add_new() {
  $('.edit_main').append('<li><div class="edit_one"><textarea class="text1"></textarea></div><div class="edit_two"><textarea class="text2"></textarea><textarea class="text3"></textarea></div><div style="clear:both;"></div></li>');
}

$(".edit_main li:last-child div.edit_two textarea:last-child").keydown(function(e) {
  var code = e.keyCode || e.which;
  if (code == 9) {
    add_new();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ol class="edit_main">
  <li>
    <div class="edit_one">
      <textarea class="text1"></textarea>
    </div>
    <div class="edit_two">
      <textarea class="text2"></textarea>
      <textarea class="text3"></textarea>
    </div>
    <div style="clear:both;"></div>
  </li>
  <li>
    <div class="edit_one">
      <textarea class="text1"></textarea>
    </div>
    <div class="edit_two">
      <textarea class="text2"></textarea>
      <textarea class="text3"></textarea>
    </div>
    <div style="clear:both;"></div>
  </li>

</ol>

jsfiddle

Answer 1

这是一次性选择器。要使其动态更新，您需要使用event delegation。

$(document).on("keydown", ".edit_main li:last-child div.edit_two textarea:last-child", function (e) {
  if (e.which == 9){
    add_card();
  }
});