即使所选选项没有更改,是否有任何方法可以在 Chrome 中的 SELECT 元素上触发单击事件?

2023-12-20

我有一个 SELECT 元素,其内容(选项元素)通过 AJAX 加载,并在准备就绪时以及更改不同的 SELECT 时插入。两个 SELECT 都有两个 OPTION 元素附加到通过 AJAX 加载的元素列表中:

<option disabled="disabled"></option>
<option value="edit">Edit&hellip;</option>

我已准备好以下 jQuery 事件绑定:

$('#theSelect').bind('change click', handleSelection);

The handleSelection()然后,方法拦截正在选择的“编辑...”选项,将选择切换回之前选择的选项,并触发显示对话框的其他功能,该对话框允许用户编辑菜单中的选项。这在 Safari 和 Chrome 中效果很好,但有一种情况在 Chrome 中不起作用:如果没有通过 AJAX 加载的选项,因此只有禁用的和“编辑...”选项可见,它不会触发选择“编辑...”选项时发生的事件。这似乎是因为,在 Chrome 中,默认选择“编辑...”选项(因为它是第一个启用的选项;而 Safari 则选择禁用的选项,因为它是第一个选项)并且只触发 SELECT 元素的更改事件,而不是点击 https://stackoverflow.com/questions/4340690/javascript-onclick-alert-not-working-in-chrome(为什么我同时听单击和更改),但是当已经选择“编辑...”时,它实际上并不是changing所以不会触发事件。

那么,我该如何解决这个问题呢?我是否需要拦截所有焦点事件并做一些肮脏的工作来解释正在发生的事情?有没有办法让 Chrome 选择禁用选项而不是“编辑...”?


At Slavo 在评论中的建议 https://stackoverflow.com/questions/10918247/is-there-any-way-to-fire-a-click-event-on-a-select-element-in-chrome-even-if-the#comment14239809_10918247,我强制所有浏览器在 AJAX 注入时选择第一个选项:

// force select the first option (fixes a Chrome issue)
$('#theSelect option:selected').removeAttr('selected')
$('#theSelect option:first-child').attr('selected', 'selected');

这标准化了浏览器行为,并使 Chrome 选择禁用选项,而不是默认启用的“编辑...”选项。

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

即使所选选项没有更改,是否有任何方法可以在 Chrome 中的 SELECT 元素上触发单击事件? 的相关文章

随机推荐

  • 在 ngFor 中声明变量

    在我的 angular2 项目中 我需要呈现一个矩阵 这是我当前的代码 tr td class worker lastName br worker firstName td td class sk table sub header div
  • redshift Convert_timezone 不起作用

    使用 Razor SQL 运行 Redshift 查询时 UTC 日期似乎被视为本地时区 并包含夏令时 例如 运行 SELECT first CONVERT TIMEZONE UTC America New York 2016 03 27
  • 方法“ToString”没有重载需要 1 个参数

    我有一个数据读取器来从数据库读取数据 我正在从销售表中读取 TotalPrice 我想将总价显示为小数点后两位 该代码是一些链接 TotalPrice Text myReader TotalPrice ToString N2 但是我遇到了这
  • Android JSONArray 循环

    这是我从网络服务得到的结果 year 2014 2013 2012 2011 2010 2009 2008 2007 2006 2005 2004 2003 2002 2001 2000 1999 1998 1997 1996 1995 1
  • 并行 make:将 -j8 设置为默认选项

    我可以使用以下命令设置构建过程的线程数 j争论 比如我有4核 4虚拟 当我写的时候 make j8速度增加4倍 是否可以将该值设置为默认值 例如 在Linux Gentoo中 在配置文件中 可以设置这个默认值 附注我有 Arch Linux
  • Windows 10 高分辨率屏幕上的 Spyder 界面图标非常小

    我有一台全新的笔记本电脑 分辨率为 3840 x 2160 运行 Windows 10 在安装 Anaconda Spyder 进行 python 编码后 我注意到图标非常小 对象检查器部分的文本也非常小 有没有办法来解决这个问题 这似乎与
  • 如何在 ANSI C 的结构中使用枚举?

    下面的代码必须在主函数中使用 但我不知道它是如何使用的 struct SomeItem enum MOVIE MUSIC itemType union struct Movie movie struct Music music 该结构用于带
  • Highchart js 最多可绘制 15 个图

    我在 Highchart js 中进行了很多尝试 但仍然找不到减少系列中元素数量的方法 如果我获得超过 15 天的数据 我必须将其减少并以 15 天的数据形式向用户显示 以便用户可以在不拥挤的情况下查看数据 该系列最多有 90 天 我必须减
  • IntelliJ IDEA 仅运行/调试一个文件

    我在 IntelliJ IDEA 中有一个 JAVA 项目 有多个包 但我的包中的某些文件有自己的main 方法并且可以自己运行 但是 如果我右键单击给定文件并选择 调试 运行 File main IntelliJ 将尝试构建包中的所有文件
  • ASP.NET MVC 3 中是否可以有多个依赖解析器?

    ASP NET MVC 3 中是否可以有多个依赖解析器 类似于 ModelBinder 和 Provider 的情况 我可以想到一种场景 拥有多个 容器 或 解析器 是有用的 那就是多租户 通过多租户 您可以在同一个 Web 应用程序中运行
  • 禁用 g++ 的返回值优化

    我需要在命令行上使用什么标志来禁用 g 编译器自动启用的返回值优化 fno elide constructors C 标准允许实现省略创建临时对象 该临时对象仅用于初始化相同类型的另一个对象 指定此选项会禁用该优化 并强制 G 在所有情况下
  • Android:调整位图大小而不损失质量

    在发布之前我确实搜索了整个网络 我的问题是 我无法在不损失图像质量的情况下调整位图大小 质量非常差并且像素化 我从相机获取位图 然后必须缩小它的尺寸 这样我就可以更快地将其上传到服务器 这是进行采样的函数 public Bitmap res
  • 继承自 HtmlHelper 而不是扩展它

    我正在创建一组用于渲染兼容的助手推特引导程序 http twitter github com bootstraphtml 在我看来 当谈到如何将这些方法组合在一起时 我有两种选择 扩展 HtmlHelper 在方法中添加 TB 前缀 创建一
  • Python正则表达式匹配<之前的单词

    所以我想匹配这样的东西 foo
  • 当前日期与日期字段之间的天数

    我有这个问题如果有人可以帮忙的话 有一个字段 date 在我的桌子上 table1 这是格式为的日期3 31 1988 M D y 我需要定义自该日期以来已经过去了多少天 我试图给出这个指示 SELECT DATEDIFF CURDATE
  • Angularjs,对表中选定的复选框应用操作

    我正在尝试学习 AngularJS 并实现此复选框 当我从网格中选择一些复选框并单击 删除 按钮时 应从选定的复选框中删除表中的数据 我尝试过但不知道如何实现它 请参阅我在 Plunker 上的这段代码 http plnkr co edit
  • 为什么 SELECT FOR UPDATE 只能在事务中起作用?

    我想我很困惑选择更新 https dev mysql com doc refman 5 0 en innodb locking reads html构造 例子 mysql gt select from employees2 EmpId Em
  • msm 包中出现错误:*** 捕获段错误 *** “内存未映射”

    我正在尝试使用 msm 包运行多状态模型 但遇到以下错误 caught segfault address 0x607c00032c60 cause memory not mapped The data dat long lt structu
  • 如何使用 JavaScript 来限制最小值/最大值之间的数字?

    我想限制两个值之间的数字 我知道在 PHP 中你可以这样做 number min max intval number 1 20 this will make number 1 if it s lower than 1 and 20 if i
  • 即使所选选项没有更改,是否有任何方法可以在 Chrome 中的 SELECT 元素上触发单击事件?

    我有一个 SELECT 元素 其内容 选项元素 通过 AJAX 加载 并在准备就绪时以及更改不同的 SELECT 时插入 两个 SELECT 都有两个 OPTION 元素附加到通过 AJAX 加载的元素列表中