JQuery選擇沒有顯示搜索框？

我有一個窗體應該使用下拉選擇的幾個字段。我在每個選擇標籤上創建了一個類。這個類用於應用每個元素上的選擇。一旦表單加載，我沒有收到任何錯誤，但選擇不起作用。只有什麼是屏幕上顯示的是這樣的：JQuery選擇沒有顯示搜索框？

選擇的圖像：https://i.stack.imgur.com/TQEK5.png

這裏是我的代碼：

<form name="frmDemo" id="frmDemo" method="POST" action="#" class="frmLayout"> 
    <fieldset> 
    <legend>Demographic</legend> 
     <div class="formItem"> 
      <label for="city" class="required">City:</label> 
      <select name="city" id="city" class="chosen"> 
       <option value="">Choose City</option> 
       <cfoutput query="getCity"> 
        <option value="#cityNum#">#cityName#</option> 
       </cfoutput> 
      </select> 
     </div> 
     <div class="formItem"> 
      <p align="center"><input type="button" name="chSubmit" id="chSubmit" value="Submit"></p> 
     </div> 
    </fieldset> 
</form>

這裏的JQuery：

$(document).ready(function() { 
    $('.chosen').each(function(){ 
     $(this).chosen(); 
    }); 
});

來源

2017-06-15 espresso_coffee

什麼都沒有在JavaScript控制檯？ – mkaatman

@mkaatman不，一切都是加載js和css。我以前使用過，而且從未體驗過類似的東西。 –

也許這是你的CSS ...以某種方式隱藏輸入 – vsync

應該是你引用不設置正確，請使用以下內容：

加載CSS -> jQuery -> chosen

<link href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.7.0/chosen.min.css" rel="stylesheet" /> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.7.0/chosen.jquery.min.js"></script>

$(document).ready(function() { 
 
    $('.chosen').each(function() { 
 
    $(this).chosen(); 
 
    }); 
 
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.7.0/chosen.min.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.7.0/chosen.jquery.min.js"></script> 
 

 
<form name="frmDemo" id="frmDemo" method="POST" action="#" class="frmLayout"> 
 
    <fieldset> 
 
    <legend>Demographic</legend> 
 
    <div class="formItem"> 
 
     <label for="city" class="required">City:</label> 
 
     <select name="city" id="city" class="chosen"> 
 
     <option value="">Choose City</option> 
 
     <cfoutput query="getCity"> 
 
      <option value="#cityNum#">#cityName#</option> 
 
     </cfoutput> 
 
     </select> 
 
    </div> 
 
    <div class="formItem"> 
 
     <p align="center"> 
 
     <input type="button" name="chSubmit" id="chSubmit" value="Submit"> 
 
     </p> 
 
    </div> 
 
    </fieldset> 
 
</form>

來源

2017-06-15 20:37:39

JQuery選擇沒有顯示搜索框？

回答

相關問題