javascript - 同一函数中两个 Select2 的多个占位符

Question

只需一个函数就可以将“Select2”加载到两个选择上。

Jquery

$('.selector1, .selector2').select2();

现在我想为选择添加占位符。
不知何故，我无法在 HTML 中做到这一点。

Jquery

$('.selector1, .selector2').select2({
  placeholder: 'selector1',
  placeholder: 'selector2'
);

代码应该是什么样的？
有可能吗？

Answer 1

试试 FIDDLE ,

您可以使用数据属性来获取所需的行为，要获取像data-placeholder 这样的数据属性，您可以使用.data()如下

<select multiple class='selector1' id="e1" style="width:300px" data-placeholder="select a state">
  <option value="AL">Alabama</option>
  <option value="Am">Amalapuram</option>
  <option value="An">Anakapalli</option>
  <option value="Ak">Akkayapalem</option>
  <option value="WY">Wyoming</option>
</select>

<select multiple class='selector2' id="e2" style="width:300px" data-placeholder="select a city">
  <option value="AL">Alabama</option>
  <option value="Am">Amalapuram</option>
  <option value="An">Anakapalli</option>
  <option value="Ak">Akkayapalem</option>
  <option value="WY">Wyoming</option>
</select>

Javascript:

$(".selector1, .selector2").each(function() {
  var placeholder = $(this).data('placeholder'); // this will get the placeholder from the control
  $(this).select2({
    placeholder: placeholder,
    allowClear: true
  });
});

希望它对你有用。