JavaScript是一种基于对象(Object)和事件驱动(Event

Javascript前台捕获浏览器关闭事件,后台处理一些善后工作

Javascript前台捕获浏览器关闭事件，后台处理一些善后工作 1.使用onbeforeunload 事件捕获浏览器关闭事件 IE和火狐都支持onbeforeunload事件，但是opera不支持。 注意：不仅关闭浏览器时会触发onbeforeunload事件，刷新等事件也会触发onbeforeunload事件。 2.事件注册方法 3.使用Ajax技术向服务器异步发送需要做的善后工作 这里以登陆为例：当用户关闭浏览器时，需要把用户登陆的状态修改为‘已退出’。由于用户登陆的状态存放在服务器的数据库中，所有必需在客户端捕获浏览器关闭动作，在浏览器关闭之前，向服务器发送一个请求，当然这个的请求是异步发送的（Ajax技术）；服务器收到请求后，把当前用户的登陆状态修改为‘已退出’。 function CloseBrowse()//用户关闭浏览器 { var n = window.event.screenX - window.screenLeft; var b = n > document.documentElement.scrollWidth - 20; //可以捕获点击小差和 Alt+F4 时浏览器关闭的情况，但是不能捕获在多窗口浏览模式下，用户点多窗口模式的小差关闭浏览器的情况 if (b && window.event.clientY < 0 || window.event.altKey) { var url = "Service.asmx/UpdateLoginState"; UpdateLoginState(url); } } //使用Ajax 向服务器发送异步请求，要求服务器修改登录状态 function UpdateLoginState() { var url = "Service.asmx/UpdateLoginState"; SendRequestToWebService(url); } function SendRequestToWebService(url){ createXmlhttp(); xmlhttp.open("POST", url, true); //xmlhttp.onreadystatechange = handleStateChange; xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;"); xmlhttp.send(); } //创建XMLHttpRequest对象 function createXmlhttp() {

Javascript鼠标触发事件大全

Javascript鼠标事件大全 一般事件 事件浏览器支持描述 onClick IE3|N2|O3 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击 onDblClick IE4|N4|O 鼠标双击事件onMouseDown IE4|N4|O 鼠标上的按钮被按下了onMouseUp IE4|N4|O 鼠标按下后，松开时激发的事件 onMouseOver IE3|N2|O3 当鼠标移动到某对象范围的上方时触发的事件 onMouseMove IE4|N4|O 鼠标移动时触发的事件 onMouseOut IE4|N3|O3 当鼠标离开某对象范围时触发的事件 onKeyPress IE4|N4|O 当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象] onKeyDown IE4|N4|O 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象] onKeyUp IE4|N4|O 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象] 页面相关事件 事件浏览器支持描述 onAbort IE4|N3|O 图片在下载时被用户中断 onBeforeUnload IE4|N|O 当前页面的内容将要被改变时触发的事件 onError IE4|N3|O 捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误 onLoad IE3|N2|O3 页面内空完成传送到浏览器时触发的事件，包括外部文件引入完成 onMove IE|N4|O 浏览器的窗口被移动时触发的事件onResize IE4|N4|O 当浏览器的窗口大小被改变时触发

JavaScript事件

我的记录（JavaScript事件）JavaScript 事件冒泡简介及应用实例 一、什么是事件冒泡 在一个对象上触发某类事件（比如单击onclick事件），如果此对象定义了此事件的处理程序，那么此事件就会调用这个处理程序，如果没有定义此事件处理程序或者事件返回true，那么这个事件会向这个对象的父级对象传播，从里到外，直至它被处理（父级对象所有同类事件都将被激活），或者它到达了对象层次的最顶层，即document对象（有些浏览器是window）。 打个比方说：你在地方法院要上诉一件案子，如果地方没有处理此类案件的法院，地方相关部门会帮你继续往上级法院上诉，比如从市级到省级，直至到中央法院，最终使你的案件得以处理。 二、事件冒泡有什么作用 （1）事件冒泡允许多个操作被集中处理（把事件处理器添加到一个父级元素上，避免把事件处理器添加到多个子级元素上），它还可以让你在对象层的不同级别捕获事件。 【集中处理例子】

控制台输出： keydown keypress keyup 2、浏览器的兼容性

(1)FireFox、Opera、Chrome 事件对应的函数有一个隐藏的变量e，表示发生事件。 e有一个属性e.which指示哪个键被按下，给出该键的索引值（按键码）。 静态函数String.fromCharCode()可以把索引值（按键码）转化成该键对应的的字符。eg： [html]view plaincopyprint? 1. 2. FireFox、Opera、Chrome中输入：a 输出：按键码：97 字符：a (2)IE IE不需要e变量，window.event表示发生事件。 window.event有一个属性window.event.keyCode指示哪个键被按下，给出该键的索引值（按键码）。 静态函数String.fromCharCode()可以把索引值（按键码）转化成该键对应的的字符。eg： [html]view plaincopyprint?

理解JavaScript中函数的使用

理解JavaScript中函数的使用 函数是进行模块化程序设计的基础，编写复杂的Ajax应用程序，必须对函数有更深入的了解。 JavaScript中的函数不同于其他的语言，每个函数都是作为一个对象被维护和运行的。通过函数对象的性质，可以很方便的将一个函数赋值给一个变量或者将函数作为参数传递。在继续讲述之前，先看一下函数的使用语法： function func1(…){…} var func2=function(…){…}; var func3=function func4(…){…}; var func5=new Function(); 这些都是声明函数的正确语法。它们和其他语言中常见的函数或之前介绍的函数定义方式有着很大的区别。那么在JavaScript中为什么能这么写？它所遵循的语法是什么呢？下面将介绍这些内容。 认识函数对象（Function Object） 可以用function关键字定义一个函数，并为每个函数指定一个函数名，通过函数名来进行调用。在JavaScript解释执行时，函数都是被维护为一个对象，这就是要介绍的函数对象（Function Object）。 函数对象与其他用户所定义的对象有着本质的区别，这一类对象被称之为内部对象，例如日期对象（Date）、数组对象（Array）、字符串对象（String）都属于内部对象。这些内置对象的构造器是由JavaScript本身所定义的：通过执行new Array()这样的语句返回一个对象，JavaScript内部有一套机制来初始化返回的对象，而不是由用户来指定对象的构造方式。 在JavaScript中，函数对象对应的类型是Function，正如数组对象对应的类型是Array，日期对象对应的类型是Date一样，可以通过new Function()来创建一个函数对象，也可以通过function关键字来创建一个对象。为了便于理解，我们比较函数对象的创建和数组对象的创建。先看数组对象：下面两行代码都是创建一个数组对象myArray： var myArray=[]; //等价于 var myArray=new Array();

实验项目21—JAVASCRIPT内置函数和对象

实验难点 实验内容实验目的 实验重点实验步骤 实验内容 1、JavaScript 内置函数的应用 2、JavaScript 内置对象的应用 3、JavaScript 浏览器对象的应用

实验难点实验内容实验目的实验重点实验步骤 实验目的 1、掌握JavaScript 内置函数的使用方法 2、掌握JavaScript 常用内置对象的属性和方法 3、掌握JavaScript 浏览器对象的含义 4、掌握使用浏览器对象提供的信息来完成一定功能的网页设计。

实验难点 实验内容实验目的实验重点实验步骤 实验重点 1、掌握JavaScript 内置函数的使用方法 2、掌握JavaScript 常用内置对象的属性和方法 3、掌握JavaScript 浏览器对象的含义

实验难点 实验内容实验目的实验重点 实验步骤 实验难点 1、掌握使用浏览器对象提供的信息来完成一定功能的网页设计。

实验难点 实验内容 实验目的 实验重点 实验步骤实验内容一：JavaScript 内置函数的应用 1、eval( )：计算字符串表达式的值 2、parseFloat( )和parseInt( )：将字符串开头的整数或浮点数分解出来，转换为整数或浮点数 3、isNaN( )：确定一个变量是否为NaN （Not a Number ） 4、escape( )：将字符串中的非字母数字字符转换为按格式%XX 表示的数字 5、unescape( )：将字符串格式为%XX 的数字转换为字符 6、程序案例1_1：求用户在提示对话框中输入的表达式的值。 7、思考题： 判断用户输入的字符是不是数字，如果是，分别将其转换成浮点数和整数，并显示到网页上。

JavaScript试题集

.单选题 1. 我们可以在下列哪个HTML元素中放置javascript代码？ A.< script > B.< javascript > C.< js > D.< scripting > ★标准答案：A 2. 预测以下代码片段的输出结果: var str ; alert(typeof str); A.. string ; B.. undefined; C.. object ; D.. String; ★标准答案：B 3. 下列哪个不是Javascript中注释的正确写法：（） A.< !-- …… -- > B. *……*/ D. /* …… */ ★标准答案：A 4. 以下哪项不属于Javascript的特征？ 是一种脚本语言 是事件驱动的 代码需要编译以后才能执行

是独立于平台的 ★标准答案：C 5. 关于以下两个陈述的描述中，正确的是：（） 陈述1：Javascript是弱类型语言 陈述2：Javascript的常用类型包括：int、string、boolean A.陈述1正确，陈述2错误 B.陈述1错误，陈述2正确 C.两个陈述都正确 D.两个陈述都错误 ★标准答案：A 6. 阅读下面的JavaScript代码： < HTML > < BODY > < SCRIPT LANGUAGE="JavaScript" > function f(y) { var x=y*y; return x; } for(x=0;x< 5;x++) { y=f(x); (y); } < /SCRIPT > < /BODY > < /HTML > 输出结果是（）。 1 2 3 4 1 4 9 16 1 4 9 16 25 D.以上答案都不对 ★标准答案：B 7. 在Javascript中，需要声明一个整数类型的变量num，以下哪个语句能实现上述要求？ num;

javascript常用函数集

javascript常用函数集 javascript提供了许多函数供开发人员使用，下面给出一个简单介绍，更详细的信息请参考Visual InterDev提供的在线关心。 javascript函数一共可分为五类： ·常规函数 ·数组函数 ·日期函数 ·数学函数 ·字符串函数 1.常规函数 javascript常规函数包括以下9个函数： (1)alert函数：显示一个警告对话框，包括一个OK按钮。 (2)confirm函数：显示一个确认对话框，包括OK、Cancel按钮。 (3)escape函数：将字符转换成Unicode码。 (4)eval函数：运算表达式的结果。 (5)isNaN函数：测试是(true)否(false)不是一个数字。 (6)parseFloat函数：将字符串转换成符点数字形式。 (7)parseInt函数：将符串转换成整数数字形式(可指定几进制)。 (8)prompt函数：显示一个输入对话框，提示等待用户输入。例如： 你好！这是一个简单事件处理程序！

计算机科学与技术系 Web 前端开发技术 11.1 事件编程（续） 1.网页访问中常见的事件 鼠标单击：例如单击button 、选中checkbo x 和radio 等元素；鼠标进入、悬浮或退出页面的某个热点：例如鼠标停在一个图片上方或者进入table 的范围； 键盘按键：当按下按键或释放按键时；页面或图像载入：例如页面body 被加载时；在表单中选取输入框或改变输入框中文本的内容：例如选中或修改了文本框中的内容；确认表单：例如当准备提交表单的内容。 事件类型：1.鼠标事件2.键盘事件3.浏览器事件

javascript试题

在HTML中，表单中的input元素的（）属性用于指定表单元素的名称。 A. value B. name C. type D. caption 当表单各项填写完毕，鼠标单击提交按钮时可以触发（）事件。 A. onenter B. onsubmit C. onmouseDrag D. onmouseOver 分析下面的JavaScript代码段，输出结果是（）。 var a=15.59; document.write(Math.round(a)); A. 15 B. 16 C. 15.5 D. 15.4 要求用JavaScript实现下面的功能：在一个文本框中内容发生改变后，单击页面的其他部分将弹出一个消息框显示文本框中的内容。下面语句正确的是（）。 A. B. C. D. 假定今天是2006年4月1日星期六，请问下列JavaScript代码在页面上的输出结果是（）。var time=new Date(); document.write(time.getDate()); A. 2006 B. 4 C. 1 D. 6 下面描述正确的是（）。 A. switch语句用于重复执行一个语句块的操作 B. switch语句根据表达式的值执行若干语句块之一，如果没有匹配项，则执行默认语句块中的语句 C. switch语句表达式中的值不能与后面case语句中的常量相匹配时将出现运行错误 D. switch语句又叫循环语句 分析如下JavaScript代码，b的值为（）。 var a=1.5 ,b; b=parseInt(a); A. 2 B. 0.5 C. 1 D. 1.5 在HTML中，使用JavaScript中的浏览器对象实现在当前窗口打开链接"https://www.wendangku.net/doc/e614913483.html,"的javascript语句是（）。 A. window.open("https://www.wendangku.net/doc/e614913483.html,"); B. document.write("https://www.wendangku.net/doc/e614913483.html,"); C. location.replace("https://www.wendangku.net/doc/e614913483.html,"); D. location.reload("https://www.wendangku.net/doc/e614913483.html,"); 如果今天是2006年5月14日，分析下列JavaScript代码运行后，在网页上显示（）。 var now = new Date(); var year = now.getYear(); var month = now.getMonth(); var date = now.getDate(); document.write(year+" "+month+" "+date); A. 2006 05 14 B. 2006 5 14 C. 2006 04 14 D. 2006 4 14 在HTML中有如下代码，运行后页面显示结果为（）。

Javascript事件

获取事件对象的全家 事件对象的获取很简单，很久前我们就知道IE中事件对象是作为全局对象( window.event )存在的，Firefox中则是做为句柄( handler )的第一个参数传入内的。所以一行代码就可以搞定 view sourceprint? 1var evt = window.event || arguments[0]; 下面分三种添加事件的方式讨论，你也许会看到以前没有看到过的获取方式。 1，第一种添加事件的方式，直接在html的属性中写JS代码 view sourceprint? 1

大概这是上世纪90年代的写法，那时候直接把js代码写在网页中很普遍，也许那时候的js并不太重要，只是用来做做验证或一些花哨的效果而已。如何在这种添加事件方式下获取到事件对象？IE中很简单，因为event是作为全局对象的，所以直接使用event即可，如下 view sourceprint? 1 点击该Div后，IE中会弹出'click'字符的信息框。说明事件对象获取到了，如果在 Opera/Safari/Chrome 中也测试了，会发现效果和IE一样，说明Opera/Safari/Chrome 中也支持IE方式( window.event )获取事件对象。 Firefox中会报错，提示：window.event is undefined，说明Firefox不支持IE方式获取事件对象而是以句柄的第一个参数传入的，文章开头意见提到了。 上面的用window.event 来获取事件对象，其实window可以省略的，就像使用alert而不是window.alert一样。如 view sourceprint? 1 在IE/Opera/Safari/Chrome 中测试，和刚刚不会有什么区别。在Firefox中再测，会有个惊喜，你会发现居然弹出的是"click"信息框，而不是"undefined"。 两次测试区别仅仅一个用window.event.type，一个用event.type。这个问题下面详细讨论。

项目18—JAVASCRIPT内置对象和函数

教学方法教学目标教学重点教学难点 教学过程 教学目标 1、掌握JavaScript 内置函数的应用 2、掌握JavaScript 内置对象的应用 3、掌握JavaScript 浏览器对象的应用

教学方法教学目标教学重点 教学难点 教学过程 教学重点 1、掌握JavaScript 内置函数的使用方法 2、掌握JavaScript 常用内置对象的属性和方法 3、掌握JavaScript 浏览器对象的含义

教学方法教学目标教学重点 教学难点 教学过程 教学难点 1、掌握使用浏览器对象提供的信息来完成一定功能的网页设计。

教学方法教学目标教学重点 教学难点 教学过程 教学方法 1、项目工程互动式教学法 2、“讲、学、观察”相结合

教学方法教学目标教学重点教学难点教学过程 一、JavaScript 内置函数的应用 JavaScript 中的系统函数又称内部方法。它提供了与任何对象无关的系统函数，使用这些函数不需创建实例，可以直接用。 1、eval( )：计算字符串表达式的值 2、parseFloat( )和parseInt( )：将字符串开头的整数或浮点数分解出来，转换为整数或浮点数 3、isNaN( )：确定一个变量是否为NaN （Not a Number ） 4、escape( )：将字符串中的非字母数字字符转换为按格式%XX 表示的数字 5、unescape( )：将字符串格式为%XX 的数字转换为字符

教学方法 教学目标教学重点教学难点 教学过程 6、程序案例1：求用户在提示对话框中输入的表达式的值。 eval( )内置函数的用法：计算字符串表达式的值。

javaScript,页面自动加载事件详解

javaScript,页面自动加载事件详解 篇一：javascript 动态添加事件 往往我们需要在 JS 中动态添加事件，这就涉及到浏览器兼容性问题了，以下谈及的几 种方法，我们也常常混合使用。 方法一、setAttribute var obj = document.getElementById("obj"); obj.setAttribute("onclick", "javascript：alert('测试');"); 这里利用 setAttribute 指定 onclick 属性，简单，很好理解， 但是： IE 不支持， IE 并不是不支持 setAttribute 这个函数， 而是不支持用 setAttribute 设 置某些属性， 包括对象属性、 集合属性、 事件属性， 也就是说用 setAttribute 设置 style、 onclick、 onmouseover 这些属性在 IE 中是行不通的。 LEO:在 IE6 下尝试成功 方法二、用 attachEvent 和 addEventListener IE 支持 attachEvent obj.attachEvent("onclick", Foo); function Foo() { alert("测试"); } 也可写在一起 obj.attachEvent("onclick", function(){alert("测试");}); 其它浏览器支持 addEventListener obj.addEventListener("click", Foo, false); function Foo() { alert("测试"); } 同样也可写在一起 obj.addEventListener("click", function(){alert("测试");}, false); 注意 attachEvent 的事件带 on，如 onclick，而 addEventListener 不带 on，如 click。 顺便说一下 addEventListener 的第三个参数（虽然很少用） useCapture - 如果为 true， 则 useCapture 指示用户希望启动捕获。启动捕获后，所有指定类型的事件将在被指派到树中 其下面的任何 EventTargets 之前指派给已注册的 EventListener。 正在通过树向上 bubbling 的 事件将不触发指定的使用捕获的 EventListener。 1 / 11

javascript如何封装函数

本文由我司收集整编，推荐下载，如有疑问，请与我司联系 javascript 如何封装函数 2017/02/28 81 通常写js 组件开发的，都会用到匿名函数的写法去封装一个对 象，与外界形成一个闭包的作用域。封装，全天下漫天遍野的封装，JQuery，EXT 和Prototype.js 封装的是javascript，jQuery uI 和jQuery mobile 封装着jQuery，java 中的JDBC 在spirng,Hibernate 等框架封装着。 1 !doctype html 2 html lang=“en” 3 head 4 meta charset=“UTF-8” 5 meta name=“viewport”content=“width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0” 6 meta http-equiv=“X-UA-Compatible”content=“ie=edge” 7 title Document /title 8 /head 9 body 10 script type=“text/javascript”11 var beibei = {12 init:function () {13 console.log(‘come in here!’);15};16 beibei.init();18 //构造函数19 function Person() {20 https://www.wendangku.net/doc/e614913483.html, = “beibei”;21 this.age = 26;22 this.getName = function () {23 return https://www.wendangku.net/doc/e614913483.html,;26 var person = new Person();27 console.log(person.age);28 console.log(person.getName());30 function Person(name,age) {31 https://www.wendangku.net/doc/e614913483.html, = name;32 this.age = age;33 this.getName = function () {34 return https://www.wendangku.net/doc/e614913483.html,;38 var p1 = new Person(“beibei”,10);39console.log(https://www.wendangku.net/doc/e614913483.html,);40 console.log(p1.age);41 console.log(p1.getName());43 //这样写是没问题的但是有一点 缺陷就是每个对象都维护相同的方法实例而其实它们可以共享此方法而不必每 个对象都生成此实例44 //在java 语言中面向对象的思想中有一条“继承”既然此方 法对于每个对象来说是公用的那么可以在它的父类中实现45 //在javascript 中继承 是基于原型对象的继承在原型对象中实现此方法，那么每个对象调用次方法时首 先查看自己是否有此方法如果有调用自己的方法46 //如果没有去原型对象中查 询调用原型对象的方法是不是和java 中的继承差不多呢？这是修改后的代码。 48 function Person(name,age) {49 https://www.wendangku.net/doc/e614913483.html, = name;50 this.age = age;53 Person.prototype.getName = function () {54 return https://www.wendangku.net/doc/e614913483.html,;57 var p1 = new Person(“beibei”,10);58console.log(https://www.wendangku.net/doc/e614913483.html,);59 console.log(p1.age);60 console.log(p1.getName());62 //对象字面量的形式构造对象63 var p1 = {64