javascript HTML:选择多个项目下拉列表

iswrvxsc  于 2022-12-21  发布在  Java
关注(0)|答案(2)|浏览(153)

我在堆栈溢出中找到了以下代码。

$(".chosen-select").chosen({
  no_results_text: "Oops, nothing found!"
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.jquery.min.js"></script>
<link href="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.min.css" rel="stylesheet"/>

<form action="http://httpbin.org/post" method="post">
  <select data-placeholder="Begin typing a name to filter..." multiple class="chosen-select" name="test">
    <option value=""></option>
    <option>American Black Bear</option>
    <option>Asiatic Black Bear</option>
    <option>Brown Bear</option>
    <option>Giant Panda</option>
    <option>Sloth Bear</option>
    <option>Sun Bear</option>
    <option>Polar Bear</option>
    <option>Spectacled Bear</option>
  </select>
  <input type="submit">
</form>

在这个问题中:HTML: Select multiple as dropdown
但是我的实现不起作用。
我复制了上面的代码(没有第一部分$)并粘贴到我的.php页面中(没有修改),然后我试着运行代码,但我的输出如下所示。
My output
我没有包括任何其他库或其他代码除了三个在代码片段。我应该做什么,以使其工作?

elcex8rz

elcex8rz1#

因此,为了解决这个问题,我必须添加

$(".chosen-select").chosen({
  no_results_text: "Oops, nothing found!"
})

到脚本标签,现在它开始工作。(我忽略了它之前,认为它没有影响在一个sense工作/不工作)。

v09wglhw

v09wglhw2#

看起来你在加载库文件之前运行了这个函数$(".chosen-select").chosen({ no_results_text: "Oops, nothing found!" })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.jquery.min.js"></script>
<link href="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.min.css" rel="stylesheet"/>

<form action="http://httpbin.org/post" method="post">
  <select data-placeholder="Begin typing a name to filter..." multiple class="chosen-select" name="test">
    <option value=""></option>
    <option>American Black Bear</option>
    <option>Asiatic Black Bear</option>
    <option>Brown Bear</option>
    <option>Giant Panda</option>
    <option>Sloth Bear</option>
    <option>Sun Bear</option>
    <option>Polar Bear</option>
    <option>Spectacled Bear</option>
  </select>
  <input type="submit">
</form>
<script>
 $(document).ready(function() {   
  $(".chosen-select").chosen({
     no_results_text: "Oops, nothing found!"
   })
 });
</script>

相关问题