JS与jQuery模拟点击a标签的跳转差异及解决方案

作者:竹影时间:2026-10-28 08:14:19浏览:310

本文对比了使用jQuery和JavaScript原生方法模拟点击a标签的行为差异。jQuery的click()仅触发绑定事件而不触发默认跳转,而document.getElementById().click()则同时触发事件与跳转。若需通过jQuery实现跳转,建议将链接文字包裹在span等可捕获元素中,并对该内部元素执行click()操作。

jQuery与JS模拟点击a标签的行为差异

具体实现代码如下:

 
<a id="alink" href="abc.aspx" style="visibility: hidden;">下一步</a>
使用jQuery执行 $("#alink").click(); 时,虽然会触发a标签上绑定的点击事件,但不会导致浏览器进行页面跳转。
改用原生JavaScript执行 document.getElementById("alink").click(); 时,则会同时触发a标签绑定的点击事件,并正常执行页面跳转。

通过内部元素实现jQuery触发跳转

若希望使用jQuery触发页面跳转,可将“下一步”文字替换为 <span id="spanId">下一步</span>,即给A标签内部的文字添加一个可被jQuery选中的元素,随后对内部元素执行 $("#spanId").click();,即可成功触发页面跳转。

作者最新文章