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>

來源

2017-12-18 Fahad Sohail

也許在你的'/ * 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);

來源

2017-12-21 18:13:33

Keyup僅適用於remove（）

回答

相關問題