如何在流星上使用select2？

Question

有人可以向我解釋一下select2如何與Meteor配合使用？ 我正在使用zimme：select2-boostrap3-css ，我對如何使用它一無所知 。

我檢查了原來的select2 github頁面和包中的那個。 第一個解釋了如何在沒有Meteor的情況下使用它。

我只是將jQuery代碼添加到我的一個* .js文件中以使其工作嗎？

在HTML中：

<select class="input" id="clientName" name="clientName">
    {{#each getClients}}
        <option value="{{clientName}}" data-id={{_id}}>{{clientName}}</option>
    {{/each}}
</select>

在JS中：

$("#clientName").select2();

因為這不起作用。

加載我的頁面時，我收到此錯誤Uncaught TypeError: $(...).select2 is not a function 。

Answer 1

未捕獲的TypeError：$（...）。select2不是函數

上面發生的錯誤是因為您沒有包含Select2的JavaScript，如評論中所述。 您鏈接的氛圍包僅用於在現有Select2包之上提供Bootstrap-esque樣式。

你還應該包括meteor add natestrauser:select2

您可能遇到的下一個問題是，當JavaScript運行時， <select class="input" >可能無法加載到DOM中，因此$("#clientName")將找不到任何內容。 要等到初始化Select2直到加載頁面，你應該將代碼包裝在jQuery的DOM ready函數$(function(){}); 並將其包裝在Meteor.Startup()以獲得良好的衡量標准，如下所示：

Meteor.startup(function () {
  $(function(){
    $("#clientName").select2();
  });
});

在Meteorpad工作演示

進一步閱讀 ：

• 如何在Meteor中准備好文檔時運行JQuery代碼？