如何使用由查詢字符串

Question

$('.dropdown-container') 
 
\t .on('click', '.dropdown-button', function() { 
 
    \t $('.dropdown-list').toggle(); 
 
\t }) 
 
\t .on('input', '.dropdown-search', function() { 
 
    \t var target = $(this); 
 
    \t var search = target.val().toLowerCase(); 
 
    
 
    \t if (!search) { 
 
      $('li').show(); 
 
      return false; 
 
     } 
 
    
 
    \t $('li').each(function() { 
 
     \t var text = $(this).text().toLowerCase(); 
 
      var match = text.indexOf(search) > -1; 
 
      $(this).toggle(match); 
 
     }); 
 
\t }) 
 
\t .on('change', '[type="checkbox"]', function() { 
 
    \t var numChecked = $('[type="checkbox"]:checked').length; 
 
    \t $('.quantity').text(numChecked || 'Any'); 
 
\t }); 
 
// JSON of States for demo purposes 
 
var usStates = [ 
 
    { name: 'ALABAMA', abbreviation: 'AL'}, 
 
    { name: 'ALASKA', abbreviation: 'AK'}, 
 
    { name: 'AMERICAN SAMOA', abbreviation: 'AS'}  
 
]; 
 
// <li> template 
 
var stateTemplate = _.template(
 
    '<li>' + 
 
    \t '<input name="<%= abbreviation %>" type="checkbox">' + 
 
    \t '<label for="<%= abbreviation %>"><%= capName %></label>' + 
 
    '</li>' 
 
); 
 
// Populate list with states 
 
_.each(usStates, function(s) { 
 
    s.capName = _.startCase(s.name.toLowerCase()); 
 
    $('ul').append(stateTemplate(s)); 
 
});

我想創建一個可搜索的多重選擇下拉菜單中創建鋰類/ ID。但是當我運行這個js文件時，它改變了HTML中的所有li。如何將js指定爲只有一個div？所以它不會與其餘的李或ul混淆。如下圖所示。

Answer 1

改變你的選擇到：

$('.dropdown-container .dropdown-list ul').append(stateTemplate(s)); 

，並在李的以及

$('.dropdown-container .dropdown-list ul li').each(function() {//....