1

我正在使用 JQuery 进行一些自定义下拉多选。

我正在做的是隐藏一个多选框，直到单击一个单独的选择框 - 以保持它所在的浏览器中的内容看起来是原生的。

但是，我试图让多选框看起来有点像普通选择框的一部分。

因此，您单击选择框，倍数出现在它的正下方，似乎是它的一部分。

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

无论如何，这一切都很好，除了我在标准框中的单个选项一直出现在多选框的顶部。

我尝试使用 z-index 属性来解决此问题，但无济于事。

有没有办法隐藏下拉菜单，或者基本上禁用下拉菜单而不实际设置禁用属性？

4

3 回答 3

2

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

$("#your_multiselect").hide(); // .show(); when you want to bring it back.
于 2013-02-28T16:26:10.180 回答
0

我最终做的是在原始选择框中没有选项，并且在多选中禁用了一个选项，上面写着“最多选择 3 个”，所以人们仍然可以看到说明，但只有在点击之后。

它不是那么好，但它会工作。

于 2013-02-28T16:44:41.563 回答
0

您可以使用 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('hidden') 到主选择框中的选项元素。

于 2013-02-28T18:51:17.760 回答