Keyup仅适用于remove（）

问题描述：

我是jQuery的初学者。我面临一个奇怪的问题。我有以下的JS这是不工作Keyup仅适用于remove（）

$(document).ready(function() { 

    $("#widget_search_affiliate_product").keyup(function() { 
     console.log("hey"); 
    }); 
});

但奇怪的是，当我加

$("#widget_search_affiliate_product").remove();

上述KEYUP功能，KEYUP功能开始工作。所以这段代码在控制台输出 “哎” 当我在widget_search_affiliate_product搜索字段中键入一些

(function($) { 
 
\t 'use strict'; 
 

 
\t $(document).ready(function() { 
 

 
    \t \t /* Ajax Widget Search */ 
 

 
    \t \t $("#widget_search_affiliate_product").remove(); 
 
    \t \t 
 

 
    \t \t $("#widget_search_affiliate_product").keyup(function() { 
 
    \t \t \t console.log("hey"); 
 
    \t \t }); 
 
    \t }); 
 

 
    })(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

HTML：

(function($) { 
 
\t 'use strict'; 
 

 
\t $(document).ready(function() { 
 

 
    \t \t /* Ajax Widget Search */ 
 

 
    \t \t console.log($('[id=widget_search_affiliate_product]').length); \t \t 
 
    \t \t $("#widget_search_affiliate_product").keyup(function() { 
 
    \t \t \t console.log("hey"); 
 
    \t \t }); 
 
    \t }); 
 

 

 

 

 
})(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> 
 

 
<div class="alp_search_product"> 
 
    \t <p> 
 
    \t \t <label for="affiliate_product_single"><strong>Search Affiliate Product:</strong></label><br> 
 
    \t \t 
 
     <input class="widefat" type="text" name="widget_search_affiliate_product" id="widget_search_affiliate_product"> 
 
    \t </p> 
 
     <div class="hidden" id="suggesstion_box"> 
 
    \t \t \t <ul></ul> 
 
    \t \t \t <i class="fa fa-circle-o-notch fa-spin fa-3x fa-fw"></i> 
 
    \t \t </div> 
 
    \t \t 
 
     <input id="affiliate_product_single" name="affiliate_product_single" type="hidden" value="Search Affiliate Product"> 
 
    \t \t <input type="hidden" id="widget_ajax_nonce" name="" value="6286139014"> 
 

 

 
<div class="alp_select_product"> 
 
    \t \t <h5 class="heading_selected_product">Selected Product</h5> 
 
    \t </div> 
 
</div>

也许在你的'/ * Ajax Widget Search * /'部分 - 你错过了*分号*？ – gurvinder372

听起来像你使用重复的ID。 ID在文档上下文中必须是唯一的。在keyup绑定之前使用并且不使用remove元素来检查它：'console.log（$（'[id = widget_search_affiliate_product]'）。'）。如果高于1，你会得到你的答案 –

@ gurvinder372我已经粘贴了整个js并检查了没有缺失的列或括号 –

答

不知怎的，我有两个widget_search_affiliate_product的实例。下面解决了这个问题

(function($) { 
'use strict'; 

$(document).ready(function() { 

    /* Ajax Widget Search */ 

    $("#widget_search_affiliate_product").remove(); 


    $(".alp_widget #widget_search_affiliate_product").keyup(function() { 
     console.log("hey"); 
    }); 
}); 

})(jQuery);

Keyup仅适用于remove（）

相关推荐