jQuery Select2-Platzhalter funktioniert nicht

Ich folge diesem Dokument http://ivaynberg.github.io/select2/ um eine Auswahlbox zu erstellen placeholder. Mein Problem ist die placeholder funktioniert nicht. Können Sie helfen, diesen Code zu reparieren?

Code: Auch bei http://jsfiddle.net/VwGGU/3/

HTML:

<select style="width:300px" id="source">
    <optgroup label="Alaskan/Hawaiian Time Zone">
        <option value="AK">Alaska</option>
        <option value="HI">Hawaii</option>
    </optgroup>
    <optgroup label="Pacific Time Zone">
        <option value="CA">California</option>
        <option value="NV">Nevada</option>
        <option value="OR">Oregon</option>
        <option value="WA">Washington</option>
    </optgroup>
</select>

Javascript:

$("#e2").select2({
    placeholder: "Select a State",
    allowClear: true
});

Das obige Beispiel zeigt “Alaska” Anstatt von “Wähle einen Staat” als Platzhalter.

UPDATE 1:

Hinzugefügt select2.js jetzt und leer option. Es wird immer noch nicht angezeigt placeholder

HTML

<select style="width:300px" id="source" placeholder="testt test">
    <option></option>
    <optgroup label="Alaskan/Hawaiian Time Zone">
        <option value="AK">Alaska</option>
        <option value="HI">Hawaii</option>
    </optgroup>
    <optgroup label="Pacific Time Zone">
        <option value="CA">California</option>
        <option value="NV">Nevada</option>
        <option value="OR">Oregon</option>
        <option value="WA">Washington</option>
    </optgroup>

JS

$(document).ready(function () {
    $("#source").select2({
        placeholder: "Select a State",
        allowClear: true
    });
});

http://jsfiddle.net/VwGGU/6/

UPDATE 2:

Seltsam, dass jsfiddle einen Fehler ausgab, als ich .css- und .js-Links von Github kopierte. Diese Version funktioniert

HTML

<select style="width:300px" id="source" >
    <option></option>
    <optgroup label="Alaskan/Hawaiian Time Zone">
        <option value="AK">Alaska</option>
        <option value="HI">Hawaii</option>
    </optgroup>
    <optgroup label="Pacific Time Zone">
        <option value="CA">California</option>
        <option value="NV">Nevada</option>
        <option value="OR">Oregon</option>
        <option value="WA">Washington</option>
    </optgroup>

JS

$(document).ready(function () {
    $("#source").select2({
        placeholder: "Select a State",
        allowClear: true
    });
});

http://jsfiddle.net/VwGGU/9/

Hast du das gemacht:

Wenn Platzhalter für ein Auswahlfeld ohne Mehrfachwerte verwendet werden, müssen Sie als erste Option ein leeres Tag einfügen

Dein select Element hat eine ID von source aber Sie zielen auf ein id von e2 in Ihrem jQuery-Selektor, und Sie benötigen eine leere <option> Schild

$selectElement.select2({
    minimumResultsForSearch: -1,
    placeholder: 'Select Relatives'
}).on('select2-opening', function() {
    $(this).closest('li').find('input').attr('placeholder','Select Relative');
});

<select id="select2Box" class="form-control brand-select">
    <option value="">Select Franchise</option>
</select>

Sie sollten der Auswahl ein leeres Options-Tag hinzufügen.

<select data-placeholder="Chose number" data-allow-clear="true" data-width="50%">
    <option></option>
    <option value="1">Number one</option>
    <option value="2">Number two</option>
    <option value="3">Number three</option>
</select>

Überprüfen Sie diesen Link Der Platzhalter funktioniert nur, wenn ein leeres Optionselement vorhanden ist

Versuchen Sie dies.In HTML schreiben Sie den folgenden Code.

<select class="select2" multiple="multiple" placeholder="Select State">
    <option value="AK">Alaska</option>
    <option value="HI">Hawaii</option>
</select>

Und in Ihr Skript schreiben Sie den folgenden Code.

<script>
         $( ".select2" ).select2( { } );
 </script>

 <script>
         $( "#id").select2({ placeholder: "Select Franchise" });
 </script>