如何在选择框中隐藏下拉列表？

我正在使用JQuery进行一点自定义下拉式多选。如何在选择框中隐藏下拉列表？

我在做什么隐藏着一个多选框，直到被点击一个单独的选择框 - 让事情在寻找它在浏览器的本地

不过，我试图让多选框看起来有点像它是正常选择框的一部分。

因此，您单击选择框并在其下方显示倍数，看起来是其中的一部分。

然后，当您做出选择并单击原始选择框时，复选框会再次消失。

无论如何，这一切都很好，除了我在标准框内的单个选项不断出现在多个选择框之上。

我试过用z-index属性来解决这个问题，但无济于事。

有没有一种方法可以隐藏下拉菜单，或者实质上禁用下拉菜单而不实际设置disabled属性？

来源

2013-02-28 user1146223

这是发生在所有的浏览器或任何特定的浏览器？ – SRy 2013-02-28 16:31:46

不幸的是所有的浏览器。我开始认为我可以从标准选择中移除焦点以使下拉消失，但.blur（）和.focus（）不会执行任何操作。 – user1146223 2013-02-28 16:37:06

您不必禁用下拉菜单，如果您使用的是jQuery，您可以简单地使用.hide()多选，它基本上将style=''属性设置为display:none;。

$("#your_multiselect").hide(); // .show(); when you want to bring it back.

来源

2013-02-28 16:26:10 fet

我实际上使用这个切换。但我遇到的问题不在于muliselect，它是原始选择中的实际下拉菜单。标准选择的下拉列表中有一个选项，可以让人们指示选择最多3个项目下拉菜单，并位于多选的顶部。我希望这是有道理的。 – user1146223 2013-02-28 16:28:17

我不认为我很明白。你能提供一个屏幕截图或线框应该发生什么？ – fet 2013-02-28 16:49:17

我已经结束了什么做的是具有原始选择框里面没有选项，并具有多选择，说被禁用的一个“选择最多3”，所以人们还是看到了说明，但只有在点击。

这不是很好，但它会工作。

来源

2013-02-28 16:44:41 user1146223

您可以使用CSS隐藏选择框中的选项元素。所以当你有多选框时，你可以以编程方式隐藏第一个选择框中的选项。这将显示当前选定的值，但在点击它时隐藏所有选项。

这里是一个简短的拨弄CSS/HTML：
http://jsfiddle.net/LWPL3/

CSS

.hidden { 
    display: none; 
}

HTML

<select> 
    <option class="hidden">Option 1</option> 
    <option class="hidden">Option 2</option> 
    <option class="hidden">Option 3</option> 
</select>

从那里，你可以只$（optionelements ）.addClass（'隐藏'）到主选框中的选项元素，只要你想隐藏它们。

来源

2013-02-28 18:51:17 bfuoco

如何在选择框中隐藏下拉列表？

回答

相关问题