jQuery中如何在dblclick()事件内使用.trigger()触发按钮点击

你当前写的实现逻辑本身没有语法错误，只要运行环境满足基础要求，完全可以达到「双击第一个Coffee列表项触发按钮点击、弹出评论模态框」的预期效果，控制台无报错也侧面说明代码没有基础语法问题。

• 仅给id为category_list_1的第一个列表项绑定了双击事件，剩下的Tea、Milk两个列表项双击不会触发任何效果
• 如果事件绑定代码执行时机早于DOM渲染（比如脚本写在页面head里、没等DOM加载完就运行），会因为找不到目标元素导致绑定失效，这类问题通常不会在控制台抛出报错，但功能完全不生效。

如果需要给所有列表项都加上双击触发能力，不用逐个给li写id绑定，直接做批量绑定即可，同时加上DOM加载完成的判断，避免执行时机问题：

// DOM全部加载完成后再执行绑定
$(function () {
  // 给ul下所有li统一绑定双击事件
  $('ul li').dblclick(function () {
    // 触发目标按钮的点击事件
    $('#show_comment_modal').trigger('click');
    // 如需获取当前双击的列表项内容/属性做后续逻辑，直接通过$(this)取值即可
    // const currentCategory = $(this).text();
  })
})

如果当前代码运行后没有达到预期，按以下顺序排查即可：

• 确认页面已经正确引入jQuery库，且jQuery的引入位置在你写的业务代码之前
• 确认按钮上data-target属性指向的#showCommentModal模态框元素真实存在，id没有拼写错误
• 确认事件绑定代码要么放在DOM加载完成的回调里，要么把脚本标签挪到</body>闭合标签之前、所有DOM元素的后方
• 测试双击时两次点击间隔不要超过500ms，间隔过长会被浏览器识别为两次独立单击，不会触发dblclick事件

内容的提问来源于stack exchange，提问作者always-a-learner