无href属性的HTML<a>标签点击行为及jQuery触发无回调点击问题咨询

1. 点击没有href属性的HTML<a>标签时，会产生什么行为？ #

当<a>标签没有href属性时，它就不再是标准的超链接，而是一个带交互能力的普通元素，点击它的行为和点击一个可聚焦的<span>很像：

• 不会触发页面跳转、刷新或锚点定位这类链接的默认行为
• 会正常触发click事件，你可以用原生JS的addEventListener或者jQuery的绑定方法来监听这个事件
• 浏览器不会给它默认的链接样式（比如蓝色下划线），除非你自己写CSS设置
• 它依然能通过Tab键获得焦点，聚焦后按Enter键也会触发click事件，这是交互式元素的默认特性

2. jQuery触发click事件但未绑定回调的原理与影响 #

先搞清楚：你写的$(".confirm-modal-trigger").click(); 和带回调的$().click(function(){...})是完全不同的用法——不带参数的click()方法是用来模拟触发元素的click事件，而不是绑定事件处理函数。

原理细节： #

这个调用本质上是触发了原生DOM元素的click()方法，会完整执行元素的click事件流：

1. 触发元素本身的click事件，同时会触发所有冒泡阶段的事件监听（比如父元素上的click处理函数）
2. 执行元素的默认行为（你的<a>没有href，所以这一步啥也不会做）

你的场景为啥有效果？ #

你的<a>标签带有data-modal-trigger和data-modal-target属性，很大概率项目里用了事件委托来全局监听这类元素，比如可能有这样的代码：

$(document).on('click', '[data-modal-trigger]', function() {
  const modalTarget = $(this).data('modal-target');
  $(modalTarget).show(); // 或者其他打开模态框的逻辑
});

这种情况下，你调用$(".confirm-modal-trigger").click()就会触发这个委托的回调，从而打开对应的模态框——这就是为啥你没直接绑定回调，但触发点击后依然有效果的原因。

可能的影响： #

• 如果这个元素没有任何绑定的事件监听（包括委托的），那这个调用不会产生任何可见效果，只是触发了一个没人响应的事件
• 它完全模拟用户手动点击的效果，包括事件冒泡，所以父元素上的click监听也会被触发
• 不会覆盖或修改已有的事件绑定，只是单纯触发一次事件

内容的提问来源于stack exchange，提问作者Hairi