<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>27-jQuery事件自动触发</title>

    <style>

        *{

            margin: 0;

            padding: 0;

        }

        .father{

            width: 200px;

            height: 200px;

            background: red;

        }

        .son{

            width: 100px;

            height: 100px;

            background: blue;

        }

    </style>

    <script src="js/jquery-1.12.4.js"></script>

    <script>

        $(function () {

            $(".son").click(function(){

                alert("son");

            }); 

            $(".father").click(function(){

                alert("father");

            }); 

            // 自动触发事件

            // $(".father").trigger("click");

            // $(".father").triggerHandler("click");

            /*

                trigger: 使用trigger自动触发事件，会触发事件冒泡

                triggerHandler：不会触发冒泡事件

            */

            // $(".son").trigger("click");

            // $(".son").triggerHandler("click");

            // $("input[type='submit']").click(function(){

            //     alert("submit");

            // });

            // trigger： 利用trigger自动触发事件，会触发默认行为

            // $("input[type='submit']").trigger("click");

            // triggerHandler  不会触发默认行为

            // $("input[type='submit']").triggerHandler("click");

            $("a").click(function(){

                alert("a");

            });

            // $("a").triggerHandler("click");

            $("a").trigger("click");

        });

    </script>

</head>

<body>

    <div class="father">

        <div class="son"></div>

    </div>

    <a href="http://www.baidu.com">我是百度</a>

    <form action="http://www.taobao.com">

        <input type="text">

        <input type="submit">

    </form>

</body>

</html>

关于自动触发a标签将部分代码修改：

<script>

    $("span").click(function(){

                alert("a");

            });

            // $("span").triggerHandler("click");

            $("span").trigger("click");

</script>
<body>

<div class="father">

    <div class="son"></div>

</div>

<a href="http://www.baidu.com"><span>注册</span></a>

<form action="http://www.taobao.com">

    <input type="text">

    <input type="submit">

</form>

</body>

jQuery事件自动触发的更多相关文章

  1. Jenkins 实现Gitlab事件自动触发Jenkins构建及钉钉消息推送

    实现Gitlab事件自动触发Jenkins构建及钉钉消息推送 实践环境 GitLab Community Edition 12.6.4 Jenkins 2.284 Post build task 1. ...

  2. 第77天：jQuery事件绑定触发

    一.元素操作 1. 高度和宽度 $(“div”).height(); // 高度 $(“div”).width(); // 宽度 .height()方法和.css(“height”)的区别: 返回值不 ...

  3. 2015.1.10 解决DataGridView SelectionChanged事件自动触发问题

    DataGridView SelectionChanged事件总是在数据源更改时自动触发,这点很讨厌. 可用CellClick和KeyUp事件和一个函数替代SelectionChanged事件 pri ...

  4. jquery 事件的触发与绑定

    bind事件绑定: live事件绑定: hover事件绑定: one事件绑定 toggle事件绑定:

  5. jquery自动触发click事件

    $("").trigger("click"); //jquery的自动触发事件

  6. jQuery事件(四)

    一.基本事件函数下面事件函数中参数相关说明:eventType:事件类型,字符串'click' 'submit'多个事件类型可以通过用空格隔开[一次性绑定'click submit']eventDat ...

  7. 使用jQuery中trigger()方法自动触发事件

    一.常用事件 在页面加载完成时  自动触发input的点击事件,在移动端可以实现自动弹出输入法,获得焦点 $("input").trigger("click") ...

  8. jQuery 学习笔记（5）（事件绑定与解绑、事件冒泡与事件默认行为、事件的自动触发、自定义事件、事件命名空间、事件委托、移入移出事件）

    1.事件绑定: .eventName(fn) //编码效率略高,但部分事件jQuery没有实现 .on(eventName, fn) //编码效率略低,所有事件均可以添加 注意点:可以同时添加多个相同 ...

  9. jQuery实现自动调用和触发某个事件的方法

    1.比如我们通过jquery定义了一个点击事件,我们如何自动触发他: $(function(){    $('#button').click(function(){      alert('butto ...

  10. HTML Select 标签选择后触发jQuery事件代码实例

    页面设计原由: 因为很多客户不知道如何来到我们公司,领导想让我在微信公众号上面做一个链接,客户可以直接通过微信公众号打开地图并导航到我们公司的办公地点. 实现起来并不难,但由于公司有很多办事处,所以需 ...

随机推荐

  1. C语言快速入门教程1快速入门 2指令 3条件选择

    快速入门 什么是C语言? C是一种编程语言,1972年由Dennis Ritchie在美国AT & T的贝尔实验室开发.C语言变得很流行,因为它很简单,很容易使用.今天经常听到的一个观点是-- ...

  2. python中的一些解码和编码

    开头 最近爬取百度贴吧搜索页的时候遇到一个url的编码问题,颇为头疼,记录下来防止下次忘记 工具网站 解码编码的工具网站推荐 http://tool.chinaz.com/tools/urlencod ...

  3. allure测试报告美化与定制

    一份简单的测试报告 一份简单的测试报告可以使用pytest的插件html就可以生成, demo如下 先下载 pip install pytest-html 下载完之后,在当前执行过测试用例的测试目录下 ...

  4. 2022-03-11：int n, int[][] roads, int x, int y， n表示城市数量，城市编号0~n-1， roads[i][j] == distance，表示城市i到城市j距

    2022-03-11:int n, int[][] roads, int x, int y, n表示城市数量,城市编号0~n-1, roads[i][j] == distance,表示城市i到城市j距 ...

  5. 2021-11-29：给定一个单链表的头节点head，每个节点都有value(＞0)，给定一个正数m， value%m的值一样的节点算一类， 请把所有的类根据单链表的方式重新连接好，返回每一类的头节点

    2021-11-29:给定一个单链表的头节点head,每个节点都有value(>0),给定一个正数m, value%m的值一样的节点算一类, 请把所有的类根据单链表的方式重新连接好,返回每一类的 ...

  6. 2021-11-19：[0,4,7] ： 0表示这里石头没有颜色，如果变红代价是4，如果变蓝代价是7，[1,X,X] ： 1表示这里石头已经是红，而且不能改颜色，所以后两个数X无意义，[2,X,X]

    2021-11-19:[0,4,7] : 0表示这里石头没有颜色,如果变红代价是4,如果变蓝代价是7,[1,X,X] : 1表示这里石头已经是红,而且不能改颜色,所以后两个数X无意义,[2,X,X] ...

  7. Can't uninstall 'Pillow'. No files were found to uninstall.

    Can't uninstall 'Pillow'. No files were found to uninstall. Pillow卸载不掉的解决办法 1.进入python所在路径,进入scripts ...

  8. Golang接收者方法语法糖

    1.概述 在<Golang常用语法糖>这篇博文中我们讲解Golang中常用的12种语法糖,在本文我们主要讲解下接收者方法语法糖. 在介绍Golang接收者方法语法糖前,先简单说下Go 语言 ...

  9. Python基础 - 算数运算符

    算数运算符   运算符 描述 实例 + 加 - 两个对象相加 a + b 输出结果 30 - 减 - 得到负数或是一个数减去另一个数 a - b 输出结果 -10 * 乘 - 两个数相乘或是返回一个被 ...

  10. 在 Net Core 开发中如何解决 Cannot access a disposed object 这个问题

    一.简介 Net Core跨平台项目开发多了,总会遇到各种各样的问题,我就遇到了一个这样的问题,不能访问 Cannot access a disposed object 错误,经过自己多方努力,查阅资 ...