本文对比了使用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();,即可成功触发页面跳转。