我尝试过多次用jQuery模拟用户点击a标签的功能，但都没有成功，并且困扰了很久。

先看下边的代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html>
<head>磨途歌-A标签测试1<head>
<body>
     <a href="http://blog.mo2g.com">磨途歌<a>
</body>
</html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"><script>
<script>
jQuery(function($) {
    //给所有A标签绑定点击触发事件
    $('a').click(function() {
        alert(1);
    });
    //触发所有A标签的点击事件
    $('a').click();
});
</script>

上边的代码确实已经触发了点击A标签事件，但大家一定也会有疑问，为什么点击了A标签，却不触发A标签的跳转事件？

一开始还以为是浏览器做了相应的安全措施，屏蔽了JS对A标签的操作，后来发现，并不是这样的，接下来就说说其中的原委。

在开始解释前，我先抛出一个问题。在我们点击“A标签”的时候，究竟是点击了什么才发生的跳转？

1）点击的是“A标签”本身？

2）点击的是“A标签”中显示的文字？

说到这里，大家应该明白了，我们上边的代码已经证实了点击A标签本身，并不会触发跳转到指定链接的事件，就是说，我们平时都是点击的A标签中的文字了？

既然有了头绪，那么就来动手试试。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<html>
<head>磨途歌-A标签测试2<head>
<body>
     <a href="http://www.mo2g.com">磨途歌<a>
</body>
</html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"><script>
<script>
jQuery(function($) {
    var mo2g = '<span id="mo2g">磨延城<span>';
    //给A标签中的文字添加一个能被jQuery捕获的元素
    $('a').append(mo2g);
    //模拟点击A标签中的文字
    $('#mo2g').click();
});
</script>

jquery模拟点击A标签的问题的更多相关文章

  1. 用js或JQuery模拟点击a标签的操作

    一.用js模拟点击a标签的操作. jsp代码: <a id="login" href="${pageContext.request.contextPath}/log ...

  2. 鼠标模拟点击a标签

    今天写程序遇到的,想要用鼠标模拟点击a标签 html代码如下: <a id="jump"></a> js代码如下: var page = ....; $(' ...

  3. JQuery模拟点击页面上的所有a标签，触发onclick事件

    注意: 这种方法需要给所有的a标签加上id属性 页面加载完成模拟点击所有的a标签: <script> $(function () { // 模拟点击页面上的所有a标签,触发onclick事 ...

  4. JavaScript或jQuery模拟点击超链接和按钮

    有时候我们需要页面自动点击超链接或者按钮,可以用js或者jQuery利用程序去点击,方法很简单,按钮或超链接代码如下: <a href="url" target=" ...

  5. jquery模拟点击事件

    在某些情况下,我们需要自动执行一些点击事件.比如:一些 tab 一般是通过点击事件来加载不同的数据内容. 而如果要页面加载完直接显示第三个 tab,怎么办呢?此时就需要用到 jQuery 的模拟点击事 ...

  6. jQuery模拟点击A标记

    这个问题弄了半小时没想明白,后来觉得是这样的. 菜单 <li class="menu"><a href="xxx.com" target=&q ...

  7. jquery click()方法模拟点击事件对a标签不生效的解决办法

    阅读数:8971 <a href="www.baidu.com"></a> 1 问题分析 点击A标签本身,并不会触发跳转到指定链接的事件,就是说,我们平时都 ...

  8. js javascript 模拟点击 超级链接点击 转

    转自:http://mo2g.com/view/42/ 我尝试过多次用jQuery模拟用户点击a标签的功能,但都没有成功,并且困扰了很久.前段时间的一次发呆,冒出了新的想法,于是就动手进行了测试. 先 ...

  9. js怎么模拟点击网页元素

    在测试页面中,引入jquery源文件,并添加一个div标签,一个a标签,为了演示效果a标签暂时不添加地址 通过jquery为div标签绑定一个点击事件,这个事件是被动执行的.意思是要点击才会触发的 在 ...

随机推荐

  1. 【BZOJ】1044: [HAOI2008]木棍分割（二分+dp）

    http://www.lydsy.com/JudgeOnline/problem.php?id=1044 如果只求最大的最小,,直接二分就行了...可是要求方案.. 好神! 我竟然想不到! 因为我们得 ...

  2. 【BZOJ】1690: [Usaco2007 Dec]奶牛的旅行（分数规划+spfa）

    http://www.lydsy.com/JudgeOnline/problem.php?id=1690 第一题不是水题的题.. 分数规划.. T-T 百度吧..http://blog.csdn.ne ...

  3. iOS开发 - CALayer图层

    CALayer的基本使用 在iOS中.你能看得见摸得着的东西基本上都是UIView.比方一个button.一个文本标签.一个文本输入框.一个图标等等.这些都是UIView 事实上UIView之所以能显 ...

  4. querySelectorAll 和getElementsByClassName的区别

    querySelectorAll 返回的是映射 改变其值不会改变document 而getElementsByClassName 改变它就会改变document 摘自JavaScript权威指南(jQ ...

  5. JSON.parse() 和 JSON.stringify() 的区别

    JSON.parse()与JSON.stringify()的区别   JSON.parse()[从一个字符串中解析出json对象] //定义一个字符串 var data='{"name&qu ...

  6. 自定义控件_VIewPager显示多个Item

    一直以来想搞明白这个不完全的VIewPager是怎么做到的,有幸看到这片篇文章 有二种实现方法 1.设置的属性 1.clipChildren属性 2.setPageMargin 3.更新Item外界面 ...

  7. 81、去除标题栏 Activity 和 AppCompatActivity

    [Activity ] requestWindowFeature(Window.FEATURE_NO_TITLE); [AppCompatActivity] getSupportActionBar() ...

  8. XE10 塔建 Android 开发环境 （已测试通过)

    XE10 塔建 Android 开发环境 1. E:\DevCSS\Android\adt-bundle-windows-x86-20131030\adt-bundle-windows-x86-201 ...

  9. vue mixins的使用

    官网传送 刚开始接触vue的时候,官网关于mixins的例子看了好几遍,发现还是不会用,包括vuex也是后来慢慢理解一点的,不过和vuex比起来.mixns还是很好理解,简单很多了 就我目前理解mix ...

  10. IIS6中给Framework2,。0站点的虚拟目录（2.0版本）下发布Web API项目（4.0版本）问题处理

    Web-API项目以虚拟目录形式部署到IIS6/IIS7 若原有站点为Framework2.0版本,在此站点(或虚拟目录站点)下,新增API虚拟目录,然后选择Framework4.0版本,IIS6和I ...