twitter bootstrap 3.0 typeahead ajax 示例

2024-01-05

Bootstrap 2 有很多 typeahead ajax 示例,例如这里twitter bootstrap typeahead ajax 示例 https://stackoverflow.com/questions/9232748/twitter-bootstrap-typeahead-ajax-example.

但是我使用的是 Bootstrap 3,我找不到完整的示例,而是只有一堆不完整的信息片段,其中包含其他网站的链接,例如这里Bootstrap 3 RC 1 中的 typeahead JavaScript 模块在哪里? https://stackoverflow.com/questions/17903645/where-is-the-typeahead-javascript-module-in-bootstrap-3-rc-1

有人可以发布一个完整的示例,说明如何在 bootstrap 3 中使用 typeahead,如果每次用户更改输入时通过 ajax 从服务器加载数据。


通过 bootstrap3-typeahead,我使其可以使用以下代码:

<input id="typeahead-input" type="text" data-provide="typeahead" />

<script type="text/javascript">
jQuery(document).ready(function() {
    $('#typeahead-input').typeahead({
        source: function (query, process) {
            return $.get('search?q=' + query, function (data) {
                return process(data.search_results);
            });
        }
    });
})
</script>

后台提供搜索服务searchGET 端点,接收查询q参数,并返回格式为 JSON{ 'search_results': ['resultA', 'resultB', ... ] }。的要素search_results数组显示在预输入输入中。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

twitter bootstrap 3.0 typeahead ajax 示例 的相关文章

  • 停止引导程序轮播在幻灯片末尾循环

    我想要这样 当我按下轮播上的下一个按钮时 如果它已到达幻灯片的末尾 则不要绕回并返回到第一张幻灯片 Bootstrap 3 有没有简单的方法可以做到这一点 设置wrap选项为 false 会使轮播自动停止循环 myCarousel caro
  • Bootstrap 3 将文本与 Div 底部对齐

    我正在尝试在 Bootstrap 中进行如下设置 其中文本与图像底部对齐 THIS IS AN IMAGE And some text
  • 如何在 AngularJS/Bootstrap3 中禁用基于复选框的内容

    我正在创建一个表单 用户可以在其中配置重复事件 因此有大量控件 顶部是一个用于启用 禁用计划的复选框 如何禁用但不隐藏基于复选框的整个部分 如果选中 用户应该能够对时间表进行修改 如果没有检查 则不允许进行任何更改 我相当确定我可以在每个控
  • 为 .API 文件启用自动完成功能?

    有谁知道如何使用 N 站点上提供的 API 文件在 Notepad 中自动完成工作 在 API 文件夹中具有 XML 自动完成文件的语言中 自动完成功能工作得很好 但对于使用 API 文件的语言 ruby AutoIt 等 完全不起作用 根
  • 引导网格中的绘图图周围有巨大的空白

    我有一个 Net 应用程序 我试图在其中使用创建一个图表bootstrap js and plotly js 当我创建响应式图表时 我遇到网格中存在巨大空白的问题 我发现问题的一部分是plotly svg container的大小默认高度为
  • 从 Bootstrap 弹出窗口调用模式

    如何从 Bootstrap 弹出窗口打开模式 我遇到了麻烦 我的示例代码如下 单击弹出窗口中的按钮不会打开模式 从页面上的任何其他位置调用模式都会启动模式 我正在为弹出窗口使用以下函数 function data toggle popove
  • 3 Div 盒子不适合容器

    在页面上 jerkydirect com base opportunity 容器内有 3 个带有图片的盒子 然而 当在大屏幕上查看时 最后一个框粘在右侧 它在较小的窗口或移动设备上看起来很棒 但在较大的屏幕上则不然 我怎样才能让它正确对齐
  • Netbeans 6.8 中的 CakePHP 帮助程序自动完成

    谁能告诉我如何在 CakePHP 中 启用 CakePHP 的 Helper 自动完成功能 本质上是这样 例如 当我输入 form gt 它给了我一个清单 form的方法和变量 我读过了http bakery cakephp org art
  • BS3 - img 响应类 - 为什么没有最大高度?

    引导程序 3 包括 img responsive班级 应用这些 css 设置 display block height auto max width 100 为什么没有max height 100 我发现添加这个使得图片的高度也适合 但我不
  • WPF 自动完成框和 Enter 键

    我试图让 WPF AutoCompleteBox 在按下 Enter 键时引发 KeyDown 事件 我使用的是普通的 KeyDown 挂钩 它适用于除 Enter 键之外的所有内容 有谁知道我该如何解决这个问题 You could inh
  • jquery ui autocomplete:如何在文本输入失去焦点后取消缓慢的ajax请求

    我正在使用 JQuery UI 自动完成字段 该字段与 ajax 查找相关 有时可能会相当慢 有时 用户会按 Tab 键离开文本输入字段afterajax 查询启动但是beforeajax 调用返回 发生这种情况时 即使文本输入不再具有焦点
  • Bootstrap 3 导航栏动态折叠

    我正在寻找引导导航栏调整大小问题的解决方案 目前 导航栏在压缩之前可以具有某种 重叠 效果 我知道这是由于媒体查询造成的 此处使用媒体查询来指示何时进行紧凑 但是我正在寻找一种解决方案 仅当 navbar nav 和 navbar righ
  • Firemonkey 编辑/组合自动完成/打字时自动建议

    实施方式是什么Autocomplete or Autosuggest适用于 Windows Android 平台以及 MacOS 和 iOS 的 Delphi Firemonkey Example 当用户在 Google 搜索框中输入文本时
  • 在引导汉堡包图标的左侧添加电话和地图图标

    我有一个基本的 bootstrap v3 网站 当导航栏在较小的屏幕上切换到汉堡包图标时 我想添加一个电话图标 链接到电话号码 和一个地图图标 链接到谷歌地图 以便移动用户可以轻松访问它们 我尝试通过在 navbar toggle 按钮之前
  • 如何根据输入的内容过滤组合框的内容?

    我们有一个包含 100 多个项目的组合框 当我们在组合框中输入字符时 我们想要过滤掉项目 例如 如果我们输入 ac 并单击下拉选项 那么我们希望它仅显示以 ac 开头的项目 我怎样才能做到这一点 也许您会更喜欢使用操作系统内置的自动完成功能
  • Chrome 如何更新网址栏补全?

    我真的很喜欢使用 Chrome 的地址栏 因为它会记住经常访问的网站 并且经常根据我之前输入和 或访问过的内容提出良好的补全建议 例如 我可以输入t在地址栏中 Chrome 会自动将其填充为twitter com 或者我可以输入mapsCh
  • 如何为 python 包模块启用自动完成(IntelliSense)?

    这个问题与 Pygame 无关 我以 Pygame 为例 While experimenting with Pygame I ve noticed that autocomplete is not working for some modu
  • 使用 bootstrap 将搜索图标放入文本框中

    我默认使用引导程序 文本框占据列的全宽 我想将搜索图标放在文本框的末尾 我的代码是这样的 div class container div class row div class form group col lg 4 div div div
  • 自动完成仅显示消息并且结果可用,使用向上和向下箭头键进行导航。而是显示列表

    我的问题很清楚 我正在使用 jquery 自动完成 我不知道为什么它只向我显示消息 9 results are available use up and down arrow keys to navigate 没有向我显示结果列表 这是我的
  • 引导程序提前输入未填充承诺的响应

    我的引导程序预输入如下

随机推荐

  • 属性编辑器设计模式?

    Warning 这是超级深入的 我理解 如果你根本不想读这篇文章 这主要是为了我整理一下我的思维过程 好的 这就是我想做的 我有这些对象 当您单击一个 或选择多个 时 它应该在右侧显示它们的属性 如图所示 当您编辑所述属性时 它应该立即更新
  • subclipse:无法加载默认 SVN 客户端

    使用 eclispe 和 subclipse 插件时 我不断收到此错误 Unable to load default SVN Client 我已经安装了 SVNKit 和 JavaHL 提供程序 但在首选项中找不到它 我正在使用 eclip
  • Amazon SES 中的特殊字符

    我正在使用适用于 PHP 的 AWS 开发工具包 https github com aws aws sdk php https github com aws aws sdk php 使用 Amazon SES 发送电子邮件 这是代码
  • 我们如何使用 C++ Lib Function 或 Windows API 在一个会话中执行多个 cmd 命令?

    在 C 中运行 cmd 命令之前 我想设置一些临时环境变量 该变量会在命令行会话结束时被删除 例如在执行下面的cmd命令之前 我想设置P4PASSWD强制环境变量 sprintf s p4Command 500 C p4 exe print
  • 将切片作为函数参数传递,并修改原始切片

    我知道 Go 中的所有内容都是按值传递的 这意味着如果我给一个函数一个切片 并且该函数使用内置函数附加到该切片append函数 那么原始切片将不会具有附加到函数范围内的值 例如 nums int 1 2 3 func addToNumbs
  • Google 地图 API 2 MapView 未更新

    我在 Android 应用程序中显示 Google Maps API v2 MapView 但奇怪的是它没有以一致的方式正确更新 我正在使用 GPS 更新地图位置 尝试了 LocationManager 和 LocationClient 尽
  • 早期返回与嵌套正 if 语句

    这是一些假设的代码示例 if e KeyCode Keys Enter if this CurrentElement null return false if this CurrentElement this MasterElement r
  • 视频标签中的 YouTube URL

    我正在使用
  • 用于 WorkItemAttribute?

    我注意到 Visual Studio 测试中有一个属性 Microsoft VisualStudio TestTools UnitTesting WorkItemAttribute 可用 我正在使用 VS 2010 Premium 和 TF
  • 为什么在Java算术中,上溢或下溢永远不会抛出异常?

    在Java算术运算期间 JVM不会抛出下溢或溢出异常 很多时候我们会遇到意想不到的结果 并想知道哪里出了问题 而在 NET 技术的情况下 我们有溢出和下溢异常 所以我的问题是 为什么Java被设计成在算术运算期间不抛出这个异常 这可能是多种
  • 如何将 before_filter 应用于 Rails 3.2.11 中每个控制器的每个操作?

    我想验证用户是否在对服务器的每个请求中登录 就像是 before filter verify logged in 我应该将 before filter 放在哪里 以便它适用于所有控制器操作和所有请求 要确保过滤器适用于所有操作 请将其放置在
  • Android JQuery focus() 解决方法

    我正在开发一个 HTML5 移动应用程序 使用常规 jQuery 而不是移动应用程序 它实现了出现在文本区域下方的自定义自动完成列表 用户从列表中选择一个选项 该单词将自动完成 然后用户照常继续输入 问题在于 用户点击文本框外部以从自动完成
  • 自动装配应用程序上下文

    我正在尝试自动装配WebApplicationContext进入一个班级ImageCreatorUtil这是我在 Spring MVC 项目中创建的 在类中执行使用应用程序上下文的方法时 我总是收到 NPE 需要注意的是 该方法是由Appl
  • 在模型中使用 cakephp 组件

    如何在我的模型类之一中使用我在 cakePHP 中创建的组件 这可能吗 如果是这样 请告诉我该怎么做 这是可能的 但很漂亮不好的做法 in a MVC http en wikipedia org wiki Model E2 80 93vie
  • HTML 输出的单元测试?

    这可能是一个愚蠢的问题 但是您是否对 PHP 函数 脚本的 HTML 输出进行单元测试 我尝试将我的 HTML 和 PHP 分开 即 HTML 包含占位符 以及某些重复元素的函数 表格数据 任何类型的循环输出 但我不知道如何去验证这一点 是
  • Firebase iOS 推送通知在首次安装时不起作用

    当我第一次安装并打开应用程序并接受来自 Apple 的通知权限警报时 我从 Firebase 收到以下日志 5 16 0 Firebase InstanceID I IID023004 无法将密钥对的属性更新为首次解锁后可访问 更新 状态
  • 生产/构建中的 Material-UI 渲染错误

    我在构建我的反应应用程序时遇到了很大的问题 我正在使用material ui core v 4 10 2 在正常的反应脚本启动开发服务器上一切正常 但是 当通过 Nginx 或 npm module 构建并提供服务时 渲染无法正常工作 我在
  • 重置等待计时器

    来自 MSDN The 取消等待定时器 http msdn microsoft com en us library ms681985 aspx函数不会改变定时器的信号状态 它会在定时器设置为有信号状态之前停止定时器并取消未完成的 APC 因
  • 类型错误:int() 参数必须是字符串、类似字节的对象或数字,而不是“datetime.datetime”

    我试图为我的所有模型添加 created at 字段 但收到以下错误 TypeError int argument must be a string a bytes like object or a number not datetime
  • twitter bootstrap 3.0 typeahead ajax 示例

    Bootstrap 2 有很多 typeahead ajax 示例 例如这里twitter bootstrap typeahead ajax 示例 https stackoverflow com questions 9232748 twit