javascript - 仅在页面重新加载后触发 jQuery 输入事件

Question

基本上我有两个div，

<div id="firstPage"></div>

和

<div id="details">
    <div id='searchBox' class='detail--searchBox'>
        <input id='txtSearchTerm' name='txtSearchTerm' type='text'>
    </div>
</div>

在页面加载时，id 为 searchBox 的文本框被隐藏，它显示在 id 为 firstPage 的 div 的点击事件中。我有以下功能，必须在文本框更改时触发。但是一旦页面重新加载就会触发此输入事件。

 onSearchBoxOnDetailsChange: function () {
     $("#searchBox").on("input", "#txtSearchTerm", function () {
         var val = $(this).val().trim();
         val = val.replace(/\s+/g, '');
         if (val.length > 1) {
             console.log(val);
         } else {

         }
     });
 },

Answer 1

编写如下代码:

onSearchBoxOnDetailsChange: function () {
  $(document).on("input", "#searchBox #txtSearchTerm", function () {
    var val = $(this).val().trim();
    val = val.replace(/\s+/g, '');
    if (val.length > 1) {
      console.log(val);
    } else {

    }
  });
},