ERP.Web/res/assets/plugins/select2/docs/_includes/options/selections/placeholder.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<section>
  <h2 id="placeholder">
    How can I have Select2 display a placeholder?
  </h2>

  <p>
    Select2 supports displaying a placeholder by default using the <code>placeholder</code> option. This can be either a data object matching the placeholder option, or a string to display as the placeholder if you are using a blank placeholder option.
  </p>

{% highlight js linenos %}
$('select').select2({
  placeholder: 'Select an option'
});
{% endhighlight %}

  <h3>
    My first option is being displayed instead of my placeholder
  </h3>

  <p>
    This usually means that you do not have a blank <code>&lt;option&gt;&lt/option&gt;</code> as the first option in your <code>&lt;select&gt;</code>.
  </p>

  <p>
    Note that this does not apply to multiple selects, as the browser does not select the first option by default when multiple selections can be made.
  </p>

  <h3>
    I am using AJAX, can I still show a placeholder?
  </h3>

  <p>
    Yes, Select2 supports placeholders for all configurations. You will still need to add in the placeholder option if you are using a single select.
  </p>

  <h3>
    Can I use an option without a blank value as my placeholder?
  </h3>

  <p>
    The <code>placeholder</code> option allows you to pass in a data object instead of just a string if you need more flexibility. The <code>id</code> of the data object should match the <code>value</code> of the placeholder option.
  </p>

{% highlight js linenos %}
$('select').select2({
  placeholder: {
    id: '-1', // the value of the option
    text: 'Select an option'
  }
});
{% endhighlight %}

  <h3>
    Can I change how the placeholder looks?
  </h3>

  <p>
    When using Select2 <strong>when only a single selection can be made</strong>, the placeholder option will be passed through the standard templating methods, including the <code>templateSelection</code> option, so you are able to change how it is displayed.
  </p>