我尝试过多次用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. freemarker include 和 import

    lib/my_test.ftl 模板内容如下: <#macto copyright date> <p>Copyright (C)${date}Julia Smith.All r ...

  2. 利用hugo生成静态站点

    动机 使用Markdown撰写博客,并以静态页面形式发布. 选择hugo 现在jekyll似乎更加流行,但是jekyll是基于Ruby的,在windows下安装很繁琐. 而hugo是用go写的,win ...

  3. 常用的一些javascript小技巧

    (转载)常用的一些javascript小技巧: http://bbs.blueidea.com/thread-2201069-1-1.html

  4. WEB安全番外第三篇--关于XXE

    一.什么是XXE 1.XML实体简介 (1)在一段时间中,XML都是WEB信息传输的主要方法,时至今日XML在WEB中作为前后台之间传递数据的结构,依然发挥着重要的作用.在XML中有一种结构叫做实体: ...

  5. 【BZOJ5071】[Lydsy十月月赛]小A的数字 发现性质

    [BZOJ5071][Lydsy十月月赛]小A的数字 题解:一般遇到这种奇奇怪怪的操作,常用的套路是将原序列差分一下,或者求个前缀和什么的.本题就是直接对原序列求前缀和,然后发现一次操作相当于交换两个 ...

  6. 记录初次使用tesseract的过程

    目录 简介 安装tesseract 安装成功 python应用识别图片 简介 这个谷歌的识别项目早就听说了,使用之后发现,真的很厉害.写下初次简单使用的过程吧. 安装tesseract 谷歌的开源识别 ...

  7. 01.ActiveMQ安装部署

      1.下载安装ActiveMQ 下载地址:http://activemq.apache.org/download-archives.html选择相应的版本,笔者选择的是:apache-activem ...

  8. [ Office 365 开发系列 ] 前言

    前言 本人从接触Microsoft SharePoint Server 2007到目前为止,已经在微软SharePoint的路上已经走了好几年,基于SharePoint平台的特殊性,对微软产品线都有了 ...

  9. SaltStack配置管理-LAMP状态设计

    上一篇:SaltStack之Salt-ssh 配置文件模板 apache: pkg.installed: - name: httpd service.running: - name: httpd /e ...

  10. Ubuntu16.4下RStudio1.1.447 中文输入问题的解决方案

    Ubuntu16.4下RStudio1.1.447 中文输入问题的解决方案参照:https://blog.csdn.net/matteoshenl/article/details/78603528 R ...