Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >引导TypeAhead.js防止无效条目

引导TypeAhead.js防止无效条目
EN

Stack Overflow用户
提问于 2013-12-28 12:34:11
回答 2查看 958关注 0票数 2

我正在使用引导typeahead.js功能来自动完成“状态”查找功能。在提交表单之前,我怎样才能最好地防止个人输入所有的内容(并且没有成功地选择阿拉斯加)?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2014-01-02 17:37:22

Typeahead.js目前不支持这种行为。

您可以使用更适合受限选项的其他库,例如Select2

然而,我有工作叉的打字机,支持这一点。

请参见此处的JQuery示例页面:

https://github.com/Svakinn/typeahead.js/blob/typeaheadSimple/Examples.md

票数 1
EN

Stack Overflow用户

发布于 2019-05-25 17:06:44

根据您的需求,您可以强制从有效选项中选择并清除任何无效的输入。

首先创建一个跟踪搜索结果的自定义source

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
    var sync = false;
    var current_results = [];
    var current_q = '';
    var selected_val = '';

    function search(q, sync) {
        current_q = q;
        window.sync = sync;
        engine.search(q, cust_sync);
    }

    function cust_sync(datums) {
      current_results = datums;
      sync(datums);
    }

    $('#typeahead').typeahead(
        {
          highlight: true,
          minLength: 0
        },
        {
            source: search // custom search engine
        }

    );

然后绑定selectchange事件处理程序。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
    $('#typeahead').bind('typeahead:change', function(ev) {
        var current_val = $('#typeahead').val();
        // user moved cursor out of input without selecting from the menu
        if(current_val != selected_val){
            // current query has search results
            if(current_results.length)
                // change input to the first valid search result
                $('#typeahead').typeahead('val', current_results[0].name); 
            // no results for this query - clear input
            else 
                $('#typeahead').typeahead('val', '');
            }
    });


    $('#typeahead').bind('typeahead:select', function(ev, suggestion) {
        selected_val = $('#typeahead').val(); // keep track of a selected value
    });
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/20819081

复制
相关文章
CA1509:代码度量配置文件中的条目无效
代码度量规则(如 CA1501、CA1502、CA1505 和 CA1506)提供了具有无效条目的名为 CodeMetricsConfig.txt 的配置文件。
呆呆
2022/02/18
6380
BibTeX条目类型
使用 BibTeX 时,各大参考文献检索网站经常会给出不同的 BibTeX 条目类型,本文便就 BibTeX 的各种条目类型及其说明进行摘录。
hotarugali
2022/11/23
4390
crontab条目包含%号问题
crontab条目中包含%号,最常见的取时间,如:date +%d, 对%需要使用\进行转义,否则不能按预期执行,正确做法为: * * * * * echo "`date +\%d`" > /tmp/r1r.txt 而不能为 * * * * * echo "`date +%d`" > /tmp/r1r.txt %是crontab的特殊字符,所有%后的被当作了标准输入,这可以通过“ man 5 crontab”查看到说明: The entire command portion of the line, up to a newline or a "%" character, will be executed by /bin/sh or by the shell specified in the SHELL variable of the cronfile. A "%" character in the command, unless escaped with a backslash (\),  will be changed into newline char-acters, and all data after the first % will be sent to the command as standard input. 示例:
一见
2019/03/14
5370
Oracle 无效对象查询,编译无效对象
查看当前无效对象 select * from dba_objects t where t.status = 'INVALID' order by 1; 编译无效对象: 有两种方式: 1、执行sql查询结果: select 'alter '||object_type||' '||owner||'.'||object_name||' compile;' from dba_objects t where t.status = 'INVALID' order by 1; 2、脚本编译: sqlplu
Lucifer三思而后行
2021/09/22
3K0
批量查看mysql表条目数
适用:centos6+ 语言:中文 注意:适用于5.7版本,其它版本要更改变量hang为2
陈不成i
2021/06/16
6.5K0
checkout无效
前景 日常工作中,遇到的一些checkout无效或者commit提交不了的情况 1.首先 你需要update的项目 会告诉你更改了那些配置,必须要还原或者提交 git pull 2.暂存提交 git stash 命令的意思是将这些更改过的配置 暂存起来,注意是暂存 3.更新 git pull #拉取最新代码 4.取暂存 git statsh pop 5.检查是否可以checkout或者commit 最后你发现之前暂存的配置,以及取出来并且成功替换了update之后的配置
cywhat
2022/11/22
2.3K0
7.5.1 创建条目列表示例
7.5.1 创建条目列表示例 #include <QApplication> #include <QTabWidget> #include <QLineEdit> #include <QSpinBox> #include <QFormLayout> #include <QListWidget> #include <QLabel> int main(int argc, char *argv[]) { QApplication a(argc, argv); /*创建QListWidget*/ QLis
DS小龙哥
2022/01/12
6600
7.5.1 创建条目列表示例
6.listview显示不用条目
文件夹页面 布局只有一个listview,可以继承listactivity,这样少写一个布局文件 tool: * @param index 箱子的索引值 * @return * 对应的uri 或
六月的雨
2018/05/14
8250
14.不同条目的listview
分类界面 整个项目的逻辑就是这样的 CategoryInfo public class CategoryInfo { private String title; private String u
六月的雨
2018/05/14
6210
websocket注入无效
@Autowired等注入无效 解决方法:在需要使用你想注入的service的地方用如下方式引用: GameRecordService gameRecordService = applicationContext.getBean(GameRecordService.class);
似水的流年
2019/12/05
2.1K0
旁观者.个性引导页个性引导页
这款个人主页简约而不失优雅,背景图片为随机api,共有38张随机图片,每次刷新都会看到不一样的美图。
小化先森
2023/03/05
1.1K0
4-VI--☆ListView的封装支持多种条目
零、前言 [1.]封装了一晚,总算把多条目的ListView封装了一下 listview.gif 一、使用 1.初始化数据 ArrayList<Message> messages
张风捷特烈
2018/09/26
4320
mysql explain 无效[通俗易懂]
最近分析一段sql 是不是命中索引的,发现有的时候 explain 是可以的,有的时候 又不行
全栈程序员站长
2022/11/02
1.9K0
WordPress CRM 表单条目跨站点脚本
https://wpscan.com/vulnerability/acd3d98a-aab8-49be-b77e-e8c6ede171ac
Khan安全团队
2022/01/05
4460
【Web性能】Javascript 代码性能优化条目(一)
初学者,特别是自学的孩子,在学习的过程中常会遇到各种各样的瓶颈,例如:如何写好javascript、要注意什么等等。这篇文章中,总结了过去javascript一些高效的写法,供大家参考。
前端修罗场
2022/07/29
5270
点击加载更多

相似问题

Spring引导中无效的条目CRC

26

如果条目无效,如何防止焦点更改?

18

Typeahead.js干扰引导输入组

42

混合Typeahead.js和引导带3

26

引导3 typeahead.js -按部分typeahead查询

23
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文