Javascript是基于对象的语言,而基于对象的基本特征,就是采用事件驱动。通常鼠标或键盘的动作称之为事件,由鼠标或键盘引发的一连串程序的动作,称之为事件驱动。而对事件进行处理的程序或函数,则称之为事件处理程序。


onClick事件

鼠标单击事件是最常用的事件之一,当用户单击鼠标时,产生onClick事件,同时onClick指定的事件处理程序或代码将被调用执行。

<input type="button" name="fullscreen" value="全屏" onclick="window.open(document.location,'big','fullscreen=yes')"/>
<input type="button" name="close" value="还原" onclick="window.close()"/>
当单击窗口中的“全屏按钮”时,将全屏显示网页,单击“还原”按钮时,将还原到原来的窗口。

onChange事件

它是一个与表单相关的事件,当利用text或textarea元素输入的字符值改变时发生该事件,同时当在select表格中的一个选项状态改变后也会引发该事件。

<textarea name="textarea" cols="30" rows="10"
        onchange="alert('输入留言内容')"></textarea>
在文本区域中可输入留言内容,在文本区域外部单击会弹出警告提示对话框

onSelect事件

onSelect事件是当文本框中的内容被选中时所发生的事件。

<input type="stra" tabindex="1" value="选择输入的名称" onselect="alert('选择输入的名称')"/>
在文本框中选中文字中后,会弹出选择文字的提示对话框。

onFocus事件

当单击表单对象时,即将光标放在文本框或选择框上时产生onFocus事件。

<input type="radio" name="radiogroup1" value="游戏" onfocus="alert('选择游戏!')"/>
<input type="radio" name="radiogroup1" value="上网" onfocus="alert('选择上网!')"/>
<input type="radio" name="radiogroup1" value="唱歌" onfocus="alert('选择唱歌!')"/>
<input type="radio" name="radiogroup1" value="跳舞" onfocus="alert('选择跳舞!')"/>
当选择代码中的任意一项单选按钮后,会弹出选择提示对话框。

onLoad事件

当加载网页文档时,会产生该事件。onLoad事件的作用是在首次载入一个页面文件时检测cookie的值,并用一个变量为其赋值,使其可以被源代码使用。

<script>
    <!-- 
     function MM_p(msg){
     alert(msg);
     }
     -->
     <body onload="MM_p('欢迎光临!')">
</script>
在浏览器中预览时,会自动弹出提示对话框“选择光临!”.

onUnload事件

当退出网页时引发onUnload事件,并可更新cookie的状态。

<script type="text/javascript">
    <!--
    function MM_p(msg){
        alert(msg);
    }
    -->
    <body onunload="MM_p('关闭本文档!')">
</script>

单击“关闭”按钮,退出页面是弹出对话框“关闭本文档!”.

onBlur事件

失去焦点事件正好与获得焦点事件相对,当text、textarea对象或select对象不再拥有焦点而退到后台时,引发该事件。

<input name="f1" type="text" onblur="MM_p('文档中的”账号“文本域失去焦点!')"/>
<input name="f2" type="text" onblur="MM_p('文档中的”密码“文本域失去焦点!')"/>
将光标移动到任意一个文本框中,再将光标移动到其他的位置,就会弹出一个提示对话框,说明某个文本框失去焦点。

onMouseOver事件

onMouseOver是当鼠标指针移动到某对象范围的上方时触发的事件。

<input type="submit" onmouseover="_data()" value="显示图像"/>
在浏览器中预览效果,将鼠标指针移动到“显示图像”按钮的上方显示图像。

onMouseOut事件

onMouseOut是当鼠标指针离开某对象范围时触发的事件。

onDblClick事件

onDbClick是鼠标双击时触发的事件。

其他常用事件

在Javascript中还提供一些其他常用事件。JavaScript 事件参考手册


浏览器的内部对象

使用浏览器的内部对象,可实现与HTML文档进行交互。浏览器的内部对象主要包括以下几个:

  • 浏览器对象(navigator):提供有关浏览器的信息。
  • 文档对象(document):此对象包含了与文档元素一起工作的对象。
  • 窗口对象(windows):此对象处于对象层次的最顶端,它提供了处理浏览器窗口的方法和属性。
  • 位置属性(location):此对象提供了与当前打开的URL一起工作的方法和属性,它是一个静态的对象。
  • 历史对象(history):此对象提供了与历史清单有关的信息。