选择jQuery插件麻烦

Question

我试图将 Chosen 的插件集成到我的 HTML 中以增加下拉功能。我在 Chosen 样式 sheet、jQuery 和 Chosen 的 JQuery 中添加了一个 link。此外，我创建了一个 class 到 jQuery 以包含在我的标签中。关于它为什么不起作用的任何想法？

<!DOCTYPE html>
<html>

<head>
  <title>Experiment</title>

  <link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.css">

  <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js"></script>

  <script type="text/javascript">
    $(function() {
      $("chosen-select").chosen();
    });
  </script>

  <style type="text/css">

  </style>
</head>

<body>
  <table>
    <tr>
      <td>
        <select class="chosen-select">
          <option value="" disabled selected>Title</option>
          <option value="clean">Clean</option>
          <option value="salvage">Salvage</option>
          <option value="rebuilt">Rebuilt</option>
        </select>
      </td>
      <td>
        <select class="chosen-select">
          <option value="" disabled selected>Title Status</option>
          <option value="in hand">In Hand</option>
          <option value="lien">Lien</option>
          <option value="missing">Missing</option>
        </select>
      </td>
      <td>
        <select class="chosen-select">
          <option value="" disabled selected>Title Stat</option>
          <option value="in hand">In Hand</option>
          <option value="lien">Lien</option>
          <option value="missing">Missing</option>
          <option value="ralph jr.">Missing</option>
          <option value="ralph">Missing</option>
        </select>
      </td>
    </tr>
  </table>


</body>

</html>

Answer 1

现在它工作正常。您错过了脚本中的 .，这就是它不起作用的原因。

<!DOCTYPE html>
<html>

<head>
  <title>Experiment</title>

  <link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.css">

  <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js"></script>

  <script type="text/javascript">
    $(function() {
      $(".chosen-select").chosen();
    });
  </script>

  <style type="text/css">

  </style>
</head>

<body>
  <table>
    <tr>
      <td>
        <select class="chosen-select">
          <option value="" disabled selected>Title</option>
          <option value="clean">Clean</option>
          <option value="salvage">Salvage</option>
          <option value="rebuilt">Rebuilt</option>
        </select>
      </td>
      <td>
        <select class="chosen-select">
          <option value="" disabled selected>Title Status</option>
          <option value="in hand">In Hand</option>
          <option value="lien">Lien</option>
          <option value="missing">Missing</option>
        </select>
      </td>
      <td>
        <select class="chosen-select">
          <option value="" disabled selected>Title Stat</option>
          <option value="in hand">In Hand</option>
          <option value="lien">Lien</option>
          <option value="missing">Missing</option>
          <option value="ralph jr.">Missing</option>
          <option value="ralph">Missing</option>
        </select>
      </td>
    </tr>
  </table>


</body>

</html>

选择jQuery插件麻烦

Chosen jQuery plugin trouble

javascript

jquery

jquery-chosen