• jQuery事件-表单事件


    表单在HTML中的应用是很多的。

    页面在加载时会触发load事件,当用户单机某个按钮时,会触发该按钮的click事件,事件在元素对象与功能代码中起着重要作用。

    事件在触发之后分为两个阶段,一个是捕获,两一个是冒泡。但是大多数浏览器并不是都支持捕获事件,jQuery也不支持。因此事件触发后往往执行冒泡过程。所谓的冒泡实质就是事件执行中的顺序。

    通过下面的一个例子来更加深刻的认知冒泡过程

    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript">
    	$(function() {
    		var count = 0;
    		$("body,div,input").click(function(){
    			count++;
    			$("p").html("欢迎点击,").append("<span>执行次数:"+count+"</span>");
    		});
    	});
    </script>
    <h3>点击开始按钮执行</h3>
    <div>
    	<input type="button" value="开始" />
    </div>
    <p>
    
    </p>
    

    从上面的代码可以看出,代码中的js部分实现的是当鼠标点击body、div或者按钮的时候会在页面中显示出欢迎点击,并且计算了执行的次数。鼠标点击开始按钮,执行后的结果如下图所示:

    表单事件冒泡过程代码的执行结果图

    从图中可以看出,当鼠标点击开始按钮之后,显示的执行次数是3次,明明只点击了一次开始按钮,为什么会执行三次代码呢?因为在事件执行过程中存在冒泡现象,单机按钮之后,按钮的点击事件触发,接着向外围冒泡,所以外围的div元素事件也会触发,body事件也跟着触发。整个事件的波及过程就像是冒水泡一样往外冒,称为冒泡过程。

    表单应用

    表单在网页中占有十分重要的地位

    文本框中的事件应用

    focus();文本框获取焦点,当文本框获得焦点时执行某些动作。

    blur();文本框失去焦点

  • 相关阅读:
    为什么这年头蓝牙功能越来越差
    猜数字-暴力枚举
    怎么使用PHPMailer实现邮件的发送??
    实现windows操作系统和VB下Linux虚拟操作系统相互传取文件方式总结
    第一篇 对Javascript中原型的深入理解
    每天进步一点点——关于SSD写入放大问题
    两步改动CentOS主机名称
    [CentOs7]搭建ftp服务器
    Another app is currently holding the yum lock
    [CentOs7]安装mysql(2)
  • 原文地址:https://www.cnblogs.com/xinxinjs/p/4730128.html
Copyright © 2020-2023  润新知