Javascript 如何更改select2中的占位符？

如何使用select2更改数据占位符

到目前为止我已经试过了

$("#city").select2({placeholder:"foo"});

而这个

$("#city").attr("data-placeholder","bar");

---

但是两者都不起作用。

我发现，如果我只设置属性，例如

$（“#city”）.attr（'data-placeholder'，'bar'）

，则没有效果。但是，如果我设置attr，然后调用

$（“#city”）。选择2（）

，不带任何参数，则占位符将更新

e、 g

---

将其放入定位器使用的html中，如下所示：

<select id="city" placeholder="my placeholder"></select>

---

用于其他人寻找属性解决方案以避免更改JS代码。我只需要自己查找一个项目，select2似乎只需要属性data placeholder=“”

---

请参阅此处的详细信息：

对于select2版本4，我在js init代码中指定了占位符文本，然后使用

$select.select2{placeholder:“更新的文本…”

在模板（html）级别也可以这样做。只需确保在第一个标记上指定一个空白字符串（例如“”）

<select id="city" data-placeholder="Select Anything">
  <option value=""></option>
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
</select>

一种更直接的方法

$('#select2-' + $id + '-container').find('.select2-selection__placeholder').text('Your Text');

---

其中，

$id

是select元素的

id

，更像是一个hack-y解决方案，但不涉及重新启动整个select元素的方法是添加以下扩展：

$.fn.getSelect2Placeholder = function () {
    var $select2Container = $(this).data('select2').$container;
    return $select2Container.find('.select2-selection__placeholder').text();
};
$.fn.setSelect2Placeholder = function (placeholder) {
    var $select2Container = $(this).data('select2').$container;
    return $select2Container.find('.select2-selection__placeholder').text(placeholder);
};

这允许通过简单地写入以下内容来更新占位符：

$('#the-id-of-your-select2-element').setSelect2Placeholder("Your placeholder text.");

---

可以使用以下脚本：

$("#city").attr('placeholder', 'your text here' );

---

它应该有用。。查看小提琴请在此小提琴中重新复制您的问题。更改为数据占位符并与select2一起使用

您也可以在已实例化占位符后通过

select2

更新占位符，而不更改周围的元素（例如

$（“#城市”）。select2（{placeholder:“}”）；

）。无论如何，（重新）应用

select2（）

元素也将失去以前通过javascriptMind在该元素上设置的任何潜在选项，告诉我为什么要否决？我只是想帮忙，但我不知道我在这件事上做错了什么？

$.fn.getSelect2Placeholder = function () {
    var $select2Container = $(this).data('select2').$container;
    return $select2Container.find('.select2-selection__placeholder').text();
};
$.fn.setSelect2Placeholder = function (placeholder) {
    var $select2Container = $(this).data('select2').$container;
    return $select2Container.find('.select2-selection__placeholder').text(placeholder);
};

$('#the-id-of-your-select2-element').setSelect2Placeholder("Your placeholder text.");

$("#city").attr('placeholder', 'your text here' );