选择 jquery，空字符串作为选项

Posted 2023-05-07

【中文标题】选择 jquery，空字符串作为选项

【英文标题】：jquery chosen, empty String as option

【发布时间】：2013-01-28 21:17:54

【问题描述】：

我在 grails 环境中的表单中使用 selected.js 进行下拉菜单。 我希望用户能够选择一个空选项，但不知何故它被忽略了。 一定有可能做到这一点？ 因为在 data-bindig 中设置诸如“select-none”之类的选项以及稍后在 data-bindig 中设置 if 条件 if select-none value="" 的解决方法会很不美观。

显示我的问题：

例如这个选择：

<g:select id="foo" data-placeholder="bar"  class="foo chzn-select" style="width: 245px;" tabindex="4" 
                    from="$['M', ' ', 'F']" value="foo" name="titel"/>

会返回：

当然，这是选择的一个很好的功能，但我想我的情况是一个常见的情况，也许你们中的某些人已经有了解决这种行为的解决方案

提前致谢

【问题讨论】：

如果您将空白选项作为列表中的第一个选项包括在内会有帮助吗？

【参考方案1】：

您还可以将 *allow_single_deselect* 设置为 true。这将有一个“x”，允许用户取消选择该选项。

$(".chzn-select").chosen( allow_single_deselect:true );

【讨论】：

请注意，这还不够，还必须有一个空值的选项。

【参考方案2】：

经过一番研究，我发现了这个帖子

https://github.com/harvesthq/chosen/issues/93

我的解决方案是在初始化选择之前通过 JS 预先设置一个选项

$("#id").prepend("<option value='' >&nbsp;</option>");

所以这个问题已经解决了，感谢  和所有看过这个的人

【讨论】：

这将隐藏取消选择选项。

不要尝试同时使用此解决方案和allow_single_deselect 选项。他们在一起表现得不好。话虽如此，分离后这仍然是一个不错的解决方案。

【参考方案3】：

<g:select name="foo" from="$foos" noSelection="[' ':' ']"  />  

【参考方案4】：

如果您的选择已经有一个空白选项，您可以跳过第一步。

1 - 你可以尝试使用like：

$(".chzn-select").prepend("<option value='' >&nbsp;</option>");

2 - 将您的选择转换为已选择：

$(".chzn-select").chosen(
    allow_single_deselect: true
);

3 - 选项“allow_single_deselect”将在您的选项中创建一个红色 X，它允许您取消选择并将该字段保留为空白值：

参考： https://harvesthq.github.io/chosen/options.html