当在 jQueryUI 自动完成列表中选择一个项目时,如何防止输入元素更新?

2024-02-05

我有以下 jQueryUI 自动完成功能

$('#clientSearch').autocomplete({
  source: function (request, response) {

    var url = window.apiUrl + '/clients?searchText=' + request.term;

    var request = $.ajax({
      url: url,
      type: 'GET',
      dataType: "json",
      cache: false,
      contentType: 'application/json; charset=utf-8'
    });

    request.done(function (clientList) {
      response($.map(clientList, function (client) {
        return {
          label: client.lastName + ', ' + client.firstInitial + '. ' + client.sex + '/' + client.age,
          value: client.id
        }
      }));
    });

    request.fail(function (jqXHR, textStatus, errorThrown) {
      response(
      {
        label: 'Error retrieving clients',
        value: null
      }
      );
    });

  },
  minLength: 2,
  select: function (event, ui) {
    event.preventDefault();
    getClient(ui.item.value);
  }
});

显示自动完成列表后,当按下向下箭头将焦点/突出显示到项目 #1 时,item.value 将显示在用户键入搜索条件的输入元素中。

根据我所读到的内容,在 select 事件中添加 event.preventDefault() (如上面的代码中所做的那样)应该会阻止 item.value 被插入到输入元素中。

但是,item.value 仍在被插入,并且在使用 ENTER“选择”突出显示的项目之前,不会命中 select 事件中的断点。

我希望原始搜索文本保留在输入元素中,因为突出显示在自动完成列表中的项目之间移动。


Use the focus http://api.jqueryui.com/autocomplete/#event-focus事件代替:

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

当在 jQueryUI 自动完成列表中选择一个项目时,如何防止输入元素更新? 的相关文章

  • 如何将当前元素传递给 Knockout.js 绑定中的 Javascript 函数?

    因此 我尝试根据是否选中子复选框 使用 Knockout js 将类添加到元素 为此 我试图通过this作为我的函数的参数 目前 我的精简 DOM 结构如下 tr td td tr
  • HTML 和 JavaScript - 将滚动操作从一个元素传递到另一个元素

    假设我有两个 div div div div A scrollable list div 我想让它当光标停在里面时 control并且鼠标滚轮滚动 view将会滚动 无论如何要实现这一目标 好的 快速修复对我有用 即使固定 div 不可滚动
  • 向特定客户端发送消息以及消息发送用户

    我是 SignalR 的初学者 我创建了一个基于 SignalR 的基本聊天应用程序 我面临的问题是我想向特定客户端以及发送消息的用户发送消息 这个怎么做 我知道要向特定客户端发送消息 我们可以这样做 Clients Client Cont
  • JavaScript / jQuery 中的范围[重复]

    这个问题在这里已经有答案了 显然我写了太多的 CoffeeScript 因为我现在意识到我对纯 JS 中的作用域没有基本的了解 玩了一段时间后 我无法弄清楚以下问题 document ready function var myUrl htt
  • Jquery:选择器找不到类?

    我正在尝试推进 Jquery autcomplete 功能 我希望 Jquery 自动完成在表中创建新行 到目前为止 这有效 但我希望 Jquery 添加一个删除按钮 因此用户可以删除他添加的项目之一 document ready func
  • 两个 OnClick 事件重叠

    我在元素内有一个元素 当我单击下面的元素时 我希望打开滑块 当我单击最外面的元素时 我希望滑块关闭 不幸的是 当我单击最外面的元素时 它也会单击下面的元素 有没有办法只单击最外面的元素而忽略下面元素的单击 这些事件在单击时触发并使用 Jav
  • 如何使用 php 发送服务器错误响应?

    一旦用户点击删除按钮我的 jQuery 脚本要求服务器删除所选项目 现在我想要我的php发送成功或错误响应的脚本 是否有可能触发错误回调万一该项目无法删除 Thanks 我的 jQuery 代码 ajax type post url myA
  • 在 javascript/jquery 中将光标更改为等待

    当调用函数时 如何让光标更改为此加载图标以及如何将其更改回 javascript jquery 中的普通光标 在你的 jQuery 中使用 body css cursor progress 然后又恢复正常 body css cursor d
  • Rails 4 可安装引擎,找不到文件“jquery”

    我正在创建一个 Rails 可安装引擎插件 它使用 gem jquery rails 我在 gemspec 文件中添加了这段代码 s add dependency jquery rails gt 3 0 1 and run bundle i
  • jQuery AJAX 调用 Java 方法

    使用 jQuery AJAX 我们可以调用特定的 JAVA 方法 例如从 Action 类 该 Java 方法返回的数据将用于填充一些 HTML 代码 请告诉我是否可以使用 jQuery 轻松完成此操作 就像在 DWR 中一样 此外 对于
  • 如何监听 jQuery AJAX 请求?

    以下两种实现 ajaxRequest 1 2 的方法应该是等效的 话说回来 为什么验证回调已执行的单元测试 3 在 1 中成功而在 2 中失败 我应该如何重写测试 3 来监视 2 中的成功回调 如果我尝试stub jQuery ajax使用
  • jquery.validate 中是否有一个函数可以像重置表单一样重置单个字段?

    我想调用 jquery 函数来手动删除单个字段中的错误并重置错误标记 是否有一个函数可以执行此操作 类似于 resetForm 函数 您可以执行以下操作来验证单个字段 your field valid 也许它会对某人有所帮助 Thanks
  • Jquery/Javascript 上传和下载文件,无需后端

    是否可以在没有后端服务器的情况下在 JavaScript 函数中下载和上传文件 我需要导出和导入由 JavaScript 函数生成的 XML 我想创建按钮 保存 xml 来保存文件 但我不知道是否可行 另一方面 我希望将 XML 文件直接上
  • 如何使输入字段和提交按钮变灰

    我想变灰这两件事 http doorsplit heroku com 歌曲输入字段和提交按钮 直到用户输入艺术家 有没有一种简单的方法可以通过 JQuery 来做到这一点 艺术家输入字段的id是 request artist 你可以这样做
  • 如何使用 JQuery 动态排序

    如果我有一个下拉列表和一个列表框 有没有办法使用 JQuery 根据下拉列表对列表框进行排序 举个例子会很有帮助 这会改变下拉菜单中的顺序 您必须根据自己的标准设置顺序
  • 使用 JQuery 更改元素的顺序

    有人知道我做错了什么吗 我正在尝试更改某些图像的显示顺序 我希望每次按下按钮时图像都会向右 向左移动一个位置 这是我尝试过的 但没有运气 任何帮助或见解将不胜感激 rightShift click function img hide var
  • Jquery 验证不能正确验证数字?

    我在使用 jquery 非侵入式验证验证数字时遇到问题 我使用的版本是 ASP NET MVC 3 jQuery 1 9 1 jQuery 用户界面 1 10 1 JQuery 验证 1 11 0 我试图验证的输入是
  • JQuery 图像上传不适用于未来的活动

    我希望我的用户可以通过帖子上传图像 因此 每个回复表单都有一个上传表单 用户可以通过单击上传按钮上传图像 然后单击提交来提交帖子 现在我的上传表单可以上传第一个回复的图像 但第二个回复的上传不起作用 我的提交过程 Ajax 在 php 提交
  • jQuery 对象相等

    如何确定两个 jQuery 对象是否相等 我希望能够在数组中搜索特定的 jQuery 对象 inArray jqobj my array 1 alert deviceTypeRoot deviceTypeRoot False alert d
  • Spring Rest 和 Jsonp

    我正在尝试让我的 Spring Rest 控制器返回jsonp但我没有快乐 如果我想返回 json 但我有返回的要求 完全相同的代码可以正常工作jsonp我添加了一个转换器 我在网上找到了用于执行 jsonp 转换的源代码 我正在使用 Sp

随机推荐

  • PHP 水印 - Zubrag

    我正在使用 zubrags PHP 水印脚本 附在下面 它的效果很好 除非我尝试使用 PNG 24 作为我的水印 生成的图像带有乱码 不透明的水印 我想知道是否有人可以帮助解释我需要在下面的脚本中更改哪些内容 以便将 PNG 24 作为正确
  • 找不到合适的 SDK 来定位

    我尝试为 UWP 创建项目 但收到此错误 我安装了 Windows 开发工具包并且它有效 谢谢
  • 使用 $http 访问原始 XHR 对象

    我需要访问原始数据XMLHttpRequest对象在支持它的浏览器上添加文件上传进度回调 这是可能的 还是我必须自己构建原始请求 如果是这样 我该如何包装生的XMLHttpRequest在承诺对象中 我模拟了 http调用构建自定义XMLH
  • 为什么迭代器方法不能采用“ref”或“out”参数?

    我今天早些时候尝试过这个 public interface IFoo IEnumerable
  • 容器内可滚动的 div

    我有以下 HTML http jsfiddle net fMs67 http jsfiddle net fMs67 我想让 div2 尊重 div1 的大小并滚动 div3 的内容 这可能吗 Thanks 更新1 这是我在提出问题时过于简单
  • JAR 文件:找不到主类

    好吧 我有一个奇怪的问题 我想将我的程序之一作为 jar 文件运行 但是当我双击打开它时 我收到一条错误消息 例如 找不到主类 程序正在关闭 我很确定我做的一切都是正确的 罐子应该可以工作 我也尝试过其他程序 每个程序都是一样的 我通过 B
  • printf 与 std::cout [重复]

    这个问题在这里已经有答案了 可能的重复 我应该在 C 代码中使用 printf 吗 https stackoverflow com questions 2017489 should i use printf in my c code 如果我
  • 如何在一张表中创建多个序列?

    我有一张 收据 表 我有列 customer id 谁有收据 和收据号 对于每个客户 receipt number 应从 1 开始 并且是一个序列 这意味着 customer id 和receipt number 将是唯一的 我怎样才能优雅
  • VIM 自定义箭头键映射不适用于窗口切换?

    我一直在尝试创建一个在 vim 中打开的窗口拆分之间切换的快捷方式 而不是必须使用 ctrl w arrowkey 我更愿意只能够使用 ctrl arrow key 这是我当前的 vimrc 中的内容 map
  • 如何实现hbase安全批量加载

    我已经在 kerberos 集群中的 hbase 中创建了一个批量加载 其驱动程序类与此类似 工作 public static void main String args try int response ToolRunner run HB
  • PHP 传递一个类作为引用?

    在Python中 你可以这样做 class SomeClass object pass s SomeClass someClassInstance s 如何在 PHP 中实现同样的效果 据我了解 你不能这样做吗 这是真的 您可以创建动态类名
  • 向 Pandas Dataframe 中的字符串添加前导零

    我有一个 pandas 数据框 其中前 3 列是字符串 ID text1 text 2 0 2345656 blah blah 1 3456 blah blah 2 541304 blah blah 3 201306 hi blah 4 1
  • 除非填写所有文本输入字段,否则禁用表单按钮

    我有一个具有多个文本输入的表单 我不想为每个输入添加 id 因为它们是从服务器端代码生成的 字段数量可能不同等 我只是希望能够禁用提交按钮 直到出现是输入到每个文本输入中的文本 我已经做到了这一点 但仅在文本输入到一个文本输入字段之前禁用按
  • 如何使用 boost bcp?

    我有 bcp 工具 它是用 boost 安装程序预先构建的 我想将 boost 所需的依赖项提取到一个较小的文件中 因为我希望能够在学校构建这个项目 我正在尝试使用 bcp 但我不明白如何使用它 尽管有以下说明 http www boost
  • Mongodb + Node.js:删除多个文档并返回

    我使用下面的代码一次删除多个文档 db collection testcollection deleteMany id in 1 2 3 function error response 有没有办法一次性删除并返回所有已删除的文档 NOTE
  • 使用 C# 自定义属性进行异常和审计跟踪日志记录

    是否可以创建一个自定义功能来捕获由自定义属性设置的方法中发生的异常 我打算做这样的事情 Logging FeatureEnum SomeFeature IntentEnum SomeIntent some comment public vo
  • 如何构建Graceful Degradation AJAX网页?

    我想用 优雅降级 构建网页 即 即使JavaScript被禁用 网页也能正常工作 现在我必须对 AJAX 响应的格式做出设计决策 如果禁用 javascript 则对服务器的每个 HTTP 请求都会生成 HTML 作为响应 浏览器将刷新并显
  • 为什么结构对齐取决于字段类型是原始类型还是用户定义的?

    In 野田时间 http nodatime orgv2 我们正在转向纳秒分辨率 这意味着我们不能再使用 8 字节整数来表示我们感兴趣的整个时间范围 这促使我研究 Noda Time 的 许多 结构体的内存使用情况 这反过来又引导我发现 CL
  • 让 NppExec 了解 Notepad++ 中当前文件的路径(对于 Python 脚本)

    很长一段时间以来第一次使用 Windows 并使用了 notepad 并使用 nppexec 插件来运行 python 脚本 但是 我注意到 notepad 没有选择保存脚本的目录 例如 我将 script py 放在 我的文档 中 但是
  • 当在 jQueryUI 自动完成列表中选择一个项目时,如何防止输入元素更新?

    我有以下 jQueryUI 自动完成功能 clientSearch autocomplete source function request response var url window apiUrl clients searchText