JQuery 自动完成,结果是链接

2024-04-10

我正在尝试创建一个 JQuery 自动完成框,其中建议自动完成的单词是链接(类似于 Facebook 或 Quora 上发生的情况)。

基本上,我希望自动完成结果下拉,并且我希望人们能够单击它们并导航到不同的页面。这是我当前使用的代码

<!DOCTYPE html>
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

  <script>
  $(document).ready(function() {
    $("input#autocomplete").autocomplete({
    source: ["Spencer Kline", "Test Test Test Test Test Test Test Test Test", "php", "coldfusion", "javascript", "asp", "ruby"]
});
  });
  </script>
</head>
<body style="font-size:62.5%;">

<input id="autocomplete" />

</body>
</html>

这很简单。将源更改为对象数组,例如:

var source = [ { value: "www.foo.com",
                 label: "Spencer Kline"
               },
               { value: "www.example.com",
                 label: "James Bond"
               },
               ...
             ];

只需使用 select 方法重定向到“值”,例如:

$(document).ready(function() {
    $("input#autocomplete").autocomplete({
        source: source,
        select: function( event, ui ) { 
            window.location.href = ui.item.value;
        }
    });
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JQuery 自动完成,结果是链接 的相关文章

  • 如何将表格中的td高度设置为0px?

    我有一个包含几行的 HTML 表 这是动态构建的 全部 tr 有一个 td inside If one td 里面没有 HTML 内容 我希望它是不可见的 如何才能做到这一点 并不是说里面的 HTML 是动态渲染的 我不想使用display
  • 滚动时输入自动完成位置错误(chrome)

    我在输入文本的默认自动完成功能方面遇到了一些麻烦 滚动时它不会相应移动 我希望自动完成文本保留在输入的正下方 有办法做到这一点吗 我在 Chrome 浏览器版本 57 0 2987 133 中发生这种情况 fiddle https jsfi
  • 无法在 JavaScript for 循环中读取 null 的属性“长度”

    我正在尝试制作一个像 Stack Overflow 那样的 Markdown 编辑器 如果我实际上没有在文本区域中键入星号和包含短语的 http 我会收到标题中列出的此错误 如果我只输入包含星号的短语 则错误指的是这一行 if linkif
  • HTML 属性不带引号?

    我一直认为html的属性中需要引号 div class service definition or div class service definition 但最近我注意到 w3 验证器不会将以下内容识别为错误 div class serv
  • 仅单击 div 内部

    我正在为一个小网站制作教程 我只想让教程气泡可点击 因此 当我们尝试单击气泡之外的某些内容时 什么也不会发生 换句话说 我希望我的 html 不可点击 而 tutorial bubble 可点击 尝试这个 jQuery function h
  • GWT - 如何组织项目以拥有多个网页以及它们之间的导航

    我是 GET 的新手 顺便说一句 它给我留下了深刻的印象 并且发现它对于像我这样熟悉 C NET 桌面技术并愿意编写 Web 应用程序的人来说非常有吸引力 我根据 GWT Eclipse 向导生成的示例启动了自己的项目 该项目生成带有面板的
  • 了解 sort() 比较函数

    我正在使用一个电子商务平台 该平台无法重新排序产品属性字段的选项 这真的很糟糕 因为要插入新选项 您几乎必须删除所有现有选项并重新开始 我正在尝试在客户端进行操作 这是我正在处理的内容 这是针对鞋码的 9 EE 9 1 2 EE 10 EE
  • 将文本大小调整为矩形 在 Canvas HTML5 中调整大小

    我是 Canvas 新手 我正在创建一个网站 以在调整矩形大小时增加文本 我尝试了很多 但没有任何效果 实际上 我希望如果我仅按其宽度调整矩形大小 向左拉伸 向右拉伸 则仅应增加文本宽度而不是字体大小 我已经完成了字体大小 但发现增加孤立文
  • jQuery 从选择选项切换 div

    我需要从下拉选择选项框中切换 div 我想要它类似于汇编选择 http www ryancramer com projects asmselect examples example1 html对于 jquery 但我不想列出选项标签 而是希
  • 如何使用 javascript/jquery/AJAX 调用 Django REST API?

    我想使用 Javascript jQuery AJAX 在前端调用 Django Rest API 请求方法是 POST 但当我看到 API 调用它的调用 OPTIONS 方法时 所以 我开始了解access control allow o
  • 如何使用 Angular JS 单击时将 html 模板附加到 div/指令?

    我有这种情况
  • 同页锚链接到部分 id 在 IE8 中不起作用

    我有一个带有导航的单页 HTML5 网站 可以将用户引导至该部分 在除 IE8 之外的所有浏览器中都可以正常工作 IE8 不执行任何操作 我所拥有的虚拟版本 a href about About a a href work Work a a
  • Perl:HTTP::微小删除留下损坏的锚标记

    我编写了一个脚本 该脚本收集从数据库读取的缓冲区内的所有 URL 检查该页面是否仍然存在 并使用 HTTP Tiny 从缓冲区中删除 URL 如果该 URL 无法访问或返回无效 问题是 HTTP Tiny 删除左锚标记 例如此处无效的文本
  • html css 下拉菜单

    这是我第一次在 Stack Overflow 上发帖 我不熟悉论坛发帖规定 所以请让我知道我做错了什么 我在论坛中研究过这个问题 但我所遇到的一切都没有给我明确的答案 我试图从 新闻 元素创建一个下拉菜单 但在运行代码时我从未得到任何可见的
  • 为什么将 x 和 y 设置为 0 时 svg 文本会消失?

    我刚刚开始阅读有关svg我提出了以下问题 我正在创建一个简单的svg with a text里面如下图所示 从我的阅读中我了解到x and y of the text标签声明文本在标签内的位置svg space 为什么当我同时设置x and
  • Django - 提交具有同一字段多个输入的表单

    预警 我对 Django 以及一般的 Web 开发 非常陌生 我使用 Django 托管一个基于 Web 的 UI 该 UI 将从简短的调查中获取用户输入 通过我用 Python 开发的一些分析来提供输入 然后在 UI 中呈现这些分析的可视
  • 即使在包裹后也具有等宽的弹性项目

    是否可以制作一个像这样的纯 CSS 解决方案 物品有一些min width 它们应该动态增长以填充所有容器宽度 然后换行到新行 列表中的所有项目都应具有相同的宽度 现在看起来是这样的 这就是我希望它看起来像的样子 我已经手动管理这些底部项目
  • 计算文本选择的 xy 位置

    我正在尝试使用 DOM 元素创建自己的文本选择 是的 我的意思是当您在此元素中选择文本时 您会在文本后面看到蓝色背景 这个想法是停止默认行为 蓝色 并使用我自己的元素来完成工作 方法是找到选择的 xy 位置 然后放置绝对定位的元素 我希望能
  • php下拉菜单人口

    我正在尝试编写一个 php 脚本 该脚本将根据主下拉菜单的选择填充第二个下拉菜单 我想使用 jquery 来完成所有非页面刷新的事情 但我发现现有的所有东西都很难理解和修改 你知道有什么写得很好且易于理解的东西吗 或者可能是现有的教程 下面
  • 如何使用Python保存“完整的网页”而不仅仅是基本的html

    我正在使用以下代码来使用 Python 保存网页 import urllib import sys from bs4 import BeautifulSoup url http www vodafone de privat tarife r

随机推荐

  • 没有图标区域的 System.Windows.Controls.MenuItem

    每当我尝试调整 WPF 菜单项的外观时 我都会浪费一次自定义标题的机会 标题基本上是项目的文本 我需要的是一个黑色菜单 白色文本 没有 图标区域 一些文字http img848 imageshack us img848 7622 icona
  • PDO 方法失败时可以不抛出 PDOException 吗?

    我正在调整为 PHP 5 2 编写的遗留数据库类 该类旨在连接到 MySQL 并隐藏所有错误 我已将 PDO 实例配置为抛出异常 new PDO dsn user pass array PDO ATTR ERRMODE gt PDO ERR
  • 将 NSProgressIndicator 添加到停靠栏图标

    我正在创建一个应用程序 它应该在停靠图标中显示进度条 目前我有这个 但它不起作用 NSProgressIndicator progressIndicator NSProgressIndicator alloc initWithFrame N
  • TFS - 迁移到新服务器。如何使用新的服务器信息更新解决方案?

    TFS 是在虚拟机上设置的 我们有 6 个开发人员正在使用它 我们已经走了一年多了 我们必须将虚拟机移动到新的数据中心 并且 IP 地址将发生变化 我们都通过 IP 而不是 HOST 或 DNS 来引用 TFS 服务器 是的 我知道 所有内
  • DataTable 不包含 AsEnumerable 的定义

    使用 linq 查询数据表返回以下错误 CS0117 DataSet1 map DataTable 不包含 AsEnumerable 的定义 项目包括 System Data Datasetextensions 的参考 这是代码 using
  • 在 React Native 中访问静态/本地图像

    在我的 React Native 项目文件夹中 我有包含组件的 src 文件 以及一些我想在 iOS 和 Android 上使用的图像 如果我用这个
  • ColdFusion Twitter API 错误请求

    我正在开展一个项目 涉及抓取 Twitter 数据信息 解析它并将其显示在我们的网站上以用于管理目的 我们还在考虑通过与 Twitter REST API 联锁的 Web 界面发布推文或更新 但首先 我想做简单的 GET 我正在尝试通过 d
  • 如何为缩略图悬停添加标题 - Bootstrap?

    我正在尝试使用这个缩略图悬停标题插件进行引导 http sevenx de demo bootstrap thumbnail hover caption html http sevenx de demo bootstrap thumbnai
  • CIImage 的 PNG/JPEG 表示形式始终返回 nil

    我目前正在制作一个照片编辑应用程序 当用户选择照片时 会使用以下代码自动将其转换为黑白 func blackWhiteImage image UIImage gt Data print Starting black white let or
  • 从信号处理程序返回而不进入内核+用户空间中断

    这是我的旧问题的后续 通过 setcontext 从信号处理程序返回 https stackoverflow com questions 69237910 returning from a signal handler via setcon
  • Web API 2 会话

    我无法从 web api 2 中获取会话数据 我已经验证 cookie 是在 fiddler 中发送的 我知道 Web api 2 的最佳实践是无状态 但由于项目的要求 现在有必要是全状态的 我已经尝试过这个链接 WebAPI 2 属性路由
  • Javascript:相当于 PHP 的 hash_hmac() 与原始二进制输出?

    我正在连接到亚马逊产品广告 API 要签署我的请求 我需要对原始二进制文件HMAC SHA256 哈希的输出 In hash hmac 的 PHP 文档 http php net manual en function hash hmac p
  • 将数据库返回的浮点值舍入为“正确”值

    我有一个数据库列 其中包含 由于某种原因在一段时间内丢失 浮点值 因此 有人用一些小值 比如 0 00025 填充数据库表 当我运行报告时 我实际上得到了 0 000249999999 或者类似的值 因为无法表示输入的值 有没有可靠的方法来
  • R Plotly - 更改悬停信息的字体和不透明度

    我正在尝试更改绘图图中悬停信息框的字体和不透明度 使用 R 我使用了以下代码 但无法弄清楚如何更改悬停框的字体或不透明度 如果这可能的话 plotC lt plot ly tg x FINPERCH y JourneyTime type s
  • 如何自动创建 AWS EB 实例到 VPC 的经典链接

    我在 EB 上有一个经典应用程序 需要连接到 VPC 中的 RDS 我可以通过进入 EC2 实例 操作 ClassicLink 链接到 VPC 来手动配置 EB 实例以允许经典链接到 VPC 一旦我这样做了 一切都很好 但是如果没有手动干预
  • Netbeans 7.1.1 中的增强

    尝试运行以下命令 include
  • 检查 PHP 日期时间戳是否正确?

    有没有办法检查 PHP 中的日期时间戳是否正确 我目前正在使用yyyy mm dd hh mm ss在 MySQL 中 并希望确保当用户以与正确格式匹配的形式提供日期 时间戳时 直到有人提供了良好的 无错误 有效的 checkdate 示例
  • 按顺序对要上传的文件列表进行排序

    我的目标是让 python 使用 telegram upload 按升序将文件从设置的目录上传到 telegram 我的脚本似乎无法按顺序上传 它以随机顺序上传文件 我用过sorted功能无济于事 查看我的脚本 您可以看到我尝试过的一些事情
  • XercesDOMParser 和 XInclusion

    我试图让 xincludes 在现有系统中工作 该系统使用 xercesc 中的 XercesDOMParser 来解析来自客户端的传入 xml 我正在使用 Apache Xercesc v3 0 1 从输入流读取的传入 XML 是
  • JQuery 自动完成,结果是链接

    我正在尝试创建一个 JQuery 自动完成框 其中建议自动完成的单词是链接 类似于 Facebook 或 Quora 上发生的情况 基本上 我希望自动完成结果下拉 并且我希望人们能够单击它们并导航到不同的页面 这是我当前使用的代码