javascript的事件响应

JavaScript创建动态页面中可以被JavaScript监听到的行为就是事件。

触发点击事件一般就是在HTML中创建一个按钮 例:<input name="button" type="button" value="按钮" onclick="函数名()">

点击这个按钮就会触发onclick内的函数。

鼠标经过和移开都可以在文本中加入onmouseover="函数名()"onmouseoue="函数名",就可以实现鼠标经过和移开触发的事件。

onchange和onselect在文本框内使用的,onchange是文本框内的内容被改变就会触发的。

onfocus当光标聚集的时候才会触发 onblur是光标先聚集然后移开就会触发。

onload是在加载页面的时候触发的事件。 onunload是在离开页面的时候触发的事件。

事件流:描述页面中接受事件的顺序。

事件冒泡是从最具体的元素到最不具体的元素(文档)。

事件捕获:是从最不具体的元素到最具体的元素。

事件对象:产生DOM事件时都会产生一个事件对象。一般用event。

事件对象event可以获取事件的类型和目标。

event.type获取事件的类型,这个事件时什么类型的点击事件还是鼠标滑过事件等等。这就是获取事件类型。

event.target获取事件的目标,这个事件目标就是获取这个事件的元素节点。按钮事件返回的就是按钮的DOM节点。

事件冒泡行为:例:在div标签内有一个button标签,两个标签都有对应的事件。如果点击按钮时先执行button按钮的事件然后还会执行div标签内的事件,button按钮是最具体元素慢慢往上传递经过div然后到body到HTML所以就会出现事件冒泡行为。可以通过event事件中阻止事件冒泡行为来实现操作button不会使div中的事件触发,event.stopPropagation();就可以阻止事件冒泡行为。

阻止事件默认的行为:比如在a标签内写入一个超链接,点击a标签内的文字就会出现跳转,那么如果想阻止这个跳转行为就可以使用event事件的阻止事件默认行为的方法。event.preventDefault();获取a标签的id然后通过句柄添加函数函数内使用阻止事件默认的行为来。

时间: 2024-08-27 19:50:21

javascript的事件响应的相关文章

【JavaScript学习】-事件响应,让网页交互

什么是事件: JavaScript 创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件. 比如说,当用户单击按钮或者提交表单数据时,就发生一个鼠标单击(onclick)事件,需要浏览器做出处理,返回给用户一个结果. 主要事件表: 事件1:onclick 说明:onclick是鼠标单击事件,当在网页上单击鼠标时,就会发生该事件.同时onclick事件调用的程序块就会被执行,通常与按钮一起使用. 实例代码:

Javascript:基础(输出/编辑内容、编辑属性、事件响应、输入验证)

Javascript是目前最流行的服务器脚本语言,使用Javascript可以为网页添加丰富的逻辑和更加复杂动态效果. 代码整理自w3school:http://www.w3school.com.cn 效果图: 示例代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

JavaScript高级用法一之事件响应与网页交互

综述 本篇的主要内容来自慕课网,事件响应与网页交互,主要内容如下 1 什么是事件 2 鼠标单击事件( onclick ) 3 鼠标经过事件(onmouseover) 4 鼠标移开事件(onmouseout) 5 光标聚焦事件(onfocus) 6 失焦事件(onblur) 7 内容选中事件(onselect) 8 文本框内容改变事件(onchange) 9 加载事件(onload) 10 卸载事件(onunload) 什么是事件 JavaScript 创建动态页面.事件是可以被 JavaScri

JavaScript系列二:变量、数组、流程控制、函数以及事件响应

JavaScript入门内容的复习:JavaScript入门 输出内容 document.write("xxx"); 弹出警告窗口 alert("xxx"); 弹出确认窗口 confirm("xxx"); 弹出提问窗口 prompt("xxx"); 单行注释 // 多行注释 /* */ 函数语法格式 function xxx() { xxxx; } 引入JS外部文件的方式 <script src="xx.js&

gridview 单击行时如何让SelectedIndexChanging事件响应

在gridview控件上单击行的时候,是不触发SelectedIndexChanging事件的,那么想要单击时触发SelectedIndexChanging事件时怎么做呢? 我是这样做的: 在gridview的行绑定事件 RowDataBound(object sender, GridViewRowEventArgs e) 中写入 if (e.Row.RowType == DataControlRowType.DataRow)        {            e.Row.Attribut

JavaScript onkeydown事件入门实例(键盘某个按键被按下)

JavaScript onkeydown 事件 用户按下一个键盘按键时会触发 onkeydown 事件.与 onkeypress事件不同的是,onkeydown 事件是响应任意键按下的处理(包括功能键),onkeypress 事件只响应字符键按下后的处理. 提示 Internet Explorer/Chrome 浏览器使用 event.keyCode 取回被按下的字符,而 Netscape/Firefox/Opera 等浏览器使用 event.which. onkeydown 获取用户按下的键

JS代码的位置与事件响应代码块的封装问题

JS代码的位置 我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分.   放在<head>部分最常用的方式是在页面中head部分放置<script>元素,浏览器解析head部分就会执行这个代码,然后才解析页面的其余部分.   放在<body>部分JavaScript代码在网页读取到该语句的时候就会执行. ? 注意 Javascript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后

javascript中事件概述

事件就是用户或浏览器自身执行的某种动作.诸如click.load.和mouseover,都是事件的名字.而响应某个事件的函数就叫做事件处理程序(或事件侦听器).事件处理程序的名字以"on"开头,因此click事件的事件处理程序就是onclick,load事件的事件处理程序就是onload. 以下是跨浏览器的javascript中事件的相关方法 1 //跨浏览器的方法 2 var EventUtil={ 3 /* 4 与addHandler()对应的方法是removeHandler(),

关于JavaScript中事件的一些重要说明

1,JavaScript异步回调 <script language="javascript"> //注册回调函数loaded到处理函数window.onload上 window.onload = loaded; //把方法window.alert地址传递给show函数 var show = window.alert; function loaded(){ show("success"); } </script> 2,事件对象 下面的js实现当