语义UI:无法通过可搜索的下拉列表"tab“
语义UI:无法通过可搜索的下拉列表"tab“
提问于 2021-05-11 15:58:29
我在一行中有多个下拉列表，我希望允许用户使用tabulator键从一个字段移动到另一个字段。
下拉列表与文本匹配，允许全文搜索，并且可清晰可见。
The键确实起作用了，但不幸的是，在下拉列表中使用the键时，第一个值会被自动选中：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Semantic UI: tabbing through select boxes</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>
</head>
<body>
<form>
<select class="ui search dropdown">
<option value="">choose one</option>
<option value="1">abc</option>
<option value="2">bcd</option>
<option value="3">cde</option>
</select>
<select class="ui search dropdown">
<option value="">choose one</option>
<option value="1">ababa</option>
<option value="2">cdcdcd</option>
<option value="3">efefef</option>
</select>
<select class="ui search dropdown">
<option value="">choose one</option>
<option value="1">ababa</option>
<option value="2">cdcdcd</option>
<option value="3">efefef</option>
</select>
</form>
<script>
window.onload = () => {
$('form .ui.dropdown').dropdown({
match: 'text',
clearable: true
});
}
</script>
</body>
</html>
我尝试过使用语义UI和字体UI的多种设置组合，但我找不到任何允许搜索下拉列表的设置组合。
通过查看action的不同选项，我可以得到一个非常有希望的选项，但是，如果只有一个选项(左边)，就不可能做出选择。
有没有人知道允许用户在不选择第一个选项的情况下在下拉列表中切换的配置？使用Semantic-UI还是Fomantic-UI？
回答 1
Stack Overflow用户
发布于 2021-05-19 13:04:12
这个Fomantic-UI问题将我带到了正确的道路上：
[Dropdown] Search selection selects first item on close
解决方案是将forceSelection设置为false
$('form .ui.dropdown').dropdown({
match: 'text',
clearable: true,
forceSelection: false
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/67482681
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号