Select2(多选） - 如果至少已经选择一个元素，如何显示备用占位符

Select2 (multiple selection) - how to display alternative placeholder if at least one element has been selected already?

本文关键字：元素 何显示 一个 显示 占位符 备用 选择 如果 多选 Select2      更新时间：2023-09-26

我有 select2 示例，如下所示：

<select 
    multiple="true"
    placeholder='Select something'
    allowClear: false
    data-bind="
        options: states, 
        optionsValue: 'id', 
        optionsText: 'text', 
        selectedOptions: selectMultipleStates, 
        select2: {}"
    style="width: 500px"
</select>

我想要两个占位符：

  • 当根本没有选择时显示的通常的（选择某些内容）
  • 另一个（选择更多），如果至少选择一个元素，将显示已经

我能想到的唯一方法是在您的 html 中有两个选择标签，并在页面加载时隐藏第二个标签，然后在第一个上添加一个 onchange 属性并运行一个函数，该函数将显示第二个选择标签，因为它的第一选择是选择更多。它会给你这样的结果：

<!doctype HTML>
<HTML>
<HEAD>
  <SCRIPT>
  window.onload=function(){
             document.getElementById('mysecondselecttag').style.display = "none";
                         };
  function ShowOtherTag()
   {
    document.getElementById('mysecondselecttag').style.display = "block";
   }
  </SCRIPT>
</HEAD>
<BODY>
 <select id="myfirstselectag" onchange="ShowOtherTag()">
  <option value="0">Select something</option>   
  <option value="1">Choice 1</option>
  <option value="2">Choice 2</option>
  <option value="3">Choice 3</option>     
 </select>
 <select id="mysecondselecttag">
  <option value="0">Select more</option>    
  <option value="1">Choice 1</option>
  <option value="2">Choice 2</option>
  <option value="3">Choice 3</option>     
 </select>
</BODY>
</HTML>
相关文章：