[Javascript] 如何更改selectize.js下拉菜单的占位符?


Answers

您可以在初始化时指定一个placeholder键作为选项对象的一部分。 我找不到在文档中的选项,只发现它通过代码挖掘。

//init selectize
$(function() {
  $('select').selectize({
    placeholder: 'Click here to select ...',
  });
});
Question

当父下拉改变其选择以加载其占位符被改变的下拉的选项时,我想改变由selectize.js创建的下拉的占位符。 在文档中没有办法做到这一点。




$('select#my-dropdown + .selectize-control').find('.selectize-control-input').prop({'placeholder': 'Placeholder Text'});



您可以通过在选择标签内添加一个空option元素来指​​定select元素的占位符。 这里是一个例子:

<select name="color" required>
    <option value=""> Select a color </option>
    <option value="1"> Lavender </option>
    <option value="2"> Eggplant </option>
    <option value="3"> Cool grey </option>
    <option value="4"> Bitter lemon </option>
</select>



我有一个类似的问题 - 令人沮丧的是我会做这样的事情:

$("selectize-input input[placeholder]").attr('placeholder','Hello World!');

然后只有在改变焦点后,它会呈现我的新占位符文本。 事实证明,无论出于何种原因(可能是一个好的选择),选择应用一个宽度到这个输入。

最终解决方案

$(".selectize-input input[placeholder]").attr('placeholder','Hello World!');
$(".selectize-input input[placeholder]").attr("style", "width: 100%;");