当你单击已经具有选定选项的输入时, DevBridge jQuery Autocomplete的每个开发人员在开发开始时都会遇到的一个典型问题是, 它在自动完成方面非常令人沮丧。考虑以下示例:
var countries = [{ value: 'Andorra', data: 'AD' }, { value: 'Zimbabwe', data: 'ZZ' }];
$('#autocomplete').autocomplete({lookup: countries, onSelect: function (suggestion) {alert('You selected: ' + suggestion.value + ', ' + suggestion.data);
}});
【如何防止onSelect事件在DevBridge jQuery Autocomplete中触发两次】用户选择一个选项后, 将按预期触发onSelect回调。但是, 如果用户再次在输入中单击并且里面已经有一个选项, 则回调将再次触发, 这显然是我们不希望的。由于某种原因, 即使在较新的版本中, 这种情况仍然会发生, 因为似乎有些人需要这种行为。就我而言, 我不需要这个, 因此有必要解决。
解不过, 解决方案非常简单, 因为至少有一个选项(在文档中很难找到或理解), 可以防止这种情况的发生。此属性是triggerSelectOnValidInput, 在这种情况下, 我想要的是false:
triggerSelectOnValidInput: false
因此, 你可以使用此选项初始化自动完成功能, 以防止出现此问题:
var countries = [{ value: 'Andorra', data: 'AD' }, { value: 'Zimbabwe', data: 'ZZ' }];
$('#autocomplete').autocomplete({lookup: countries, triggerSelectOnValidInput: false, onSelect: function (suggestion) {alert('You selected: ' + suggestion.value + ', ' + suggestion.data);
}});
现在, 仅当用户搜索内容并从自动完成下拉列表中选择内容时, 才会触发回调。
编码愉快!
推荐阅读
- 在Subversion版本库中运行svn update之前,如何知道要更新/删除/创建哪些文件
- 如何在Windows的NetBeans中配置集成终端(命令提示符)
- 如何在Dompdf中将图像与表格单元格的底部对齐
- Magento的7大发展趋势
- 如何在MySQL中反转/翻转TinyInt或Boolean列的值
- 如何在Windows中配置NetBeans以将SASS或SCSS文件自动编译为CSS
- 如何在Windows上使用XAMPP恢复InnoDB MySQL文件
- 如何下载和安装自定义UI PHPMyAdmin主题
- 没有找到“com.google.android.material.button.MaterialButton”类