如何隐藏搜索框和占位符？

Posted 2023-05-07

【中文标题】如何隐藏搜索框和占位符？

【英文标题】：How do I hide the search box and placeholder?

【发布时间】：2015-08-11 02:57:48

【问题描述】：

基本上我需要select2 的帮助。现在我有一个带有这个 JQuery 代码的搜索框。当我预览它时，也没有占位符。

<script type="text/javascript">

$(document).ready(function() 
  $('select').select2(
  placeholder: "Select a Townhall Level",
    allowClear: true
  );
);
</script>
</head>

这是一张图片：

所以我想知道如何隐藏搜索呢？我完全没有使用 JQuery 的经验，因此将不胜感激。 感谢您抽出宝贵时间阅读！

这是我的 html：http://pastebin.com/P8in7ASX

【问题讨论】：

你能把html部分也发一下吗

你在用php吗？是什么决定了您希望它显示还是隐藏？

这是我的 html：pastebin.com/P8in7ASX@GeorgeLee

@SariRahal 现在我只做设计部分，但我稍后会使用 php 来编写函数 :)

占位符不显示，因为您没有空选项作为您选择的第一个选项（请参阅：***.com/a/25410119/4665459）。但是，如果您不想要搜索框，为什么还要使用 select2？

【参考方案1】：

您可以像这样设置 minimumResultsForSearch 来隐藏搜索：

$(document).ready(function() 
  $('select').select2(
    placeholder: "Select a Townhall Level",
    minimumResultsForSearch: Infinity,
    allowClear: true
  );
);

如果您有一个空选项作为选择中的第一个选项，则可以显示占位符：

<select>
    <option></option>
    ... other options ...
</select>

如果您想针对特定选择而不是所有选择，并且能够对每个选择应用不同的属性，请更改为：

$(document).ready(function() 
  $('#targetElement1').select2(
    ... the properties you want applied to targetElement1 ...
  );

  $('#targetElement2').select2(
    ... the properties you want applied to targetElement2 ...
  );  
);

并提供您的选择 ID：

<select id="targetElement1">
    <option></option>
    ... other options ...
</select>

<select id="targetElement2">
    <option></option>
    ... other options ...
</select>

【讨论】：

如果我想将它用于特定的盒子怎么办？

@JohnBorton，请参阅我的更新以了解如何定位特定元素。

非常感谢您的帮助，我真的很感激，有什么方法可以联系您吗？对此我感激不尽，再次感谢！

编辑：目标元素由于某种原因没有工作，即使我完全按照你说的那样做:)

它有效。确保您正确复制它，并确保您没有使用 $('select') 的旧代码。