My白开水

导航

8月14号=》401页-405页

15.1.2  绑定DOM对象属性

    绑定到DOM对象属性时,开发者无须修改HTML元素的代码,二是将事件处理函数放在JavaScript脚本中绑定。

    代码示范:

      //脚本代码

      document.getElementById("testBtn").onclick = test;

      var test = function()

      {

        alert("绑定测试");

      }

      //HTML代码

      <button id="testBtn">测试</button>

    点击测试按钮将会弹出“绑定测试”对话框。

 

标准的HTML文档控件支持的事件及对应描述

事件 对应的含义 支持该事件的HTML标签
onabort 图片加载被中断 <img>
onblur 当某个HTML元素失去焦点时触发该事件

<button>、<input>、<label>、<select>、<textarea>、

<body>

onchange 当表单域的值被修改时触发 <input>、<select>、<textarea>
onclick 单击某个元素时触发 大多数可显示的标签
ondblclick 双击某个元素时触发 大多数可显示的标签
onerror 图片加载出错时触发 <img>
onfocus 当某个标签得到焦点时触发

<button>、<input>、<label>、<select>、<textarea>、

<body>

onkeydown 当焦点在当前元素上面,按下键盘的某个键时触发 表单控件标签和<body>标签
onkeypress 当焦点在当前元素上面,按下键盘的某个键时触发 表单控件标签和<body>标签
onkeyup 当焦点在当前元素上面,并且松开了键盘的某个键时触发 表单控件标签和<body>标签
onload 当某个对象被装载完毕时触发 <body>、<iframe>、<img>
onmousedown 当焦点停留在当前元素上面,并且按下鼠标键时触发 大多数可显示的标签
onmousemove 当鼠标在当前元素上面,并且鼠标在当前元素上面移动时触发 大多数可显示的标签
onmouseout 当鼠标移出某个元素时触发,即鼠标一开始停留在元素上面 大多数可显示的标签
onmouseover 当鼠标移动到该元素上面时触发 大多数可显示的标签
onmouseup 当焦点在当前元素上面,并且松开鼠标键时触发 大多数可显示的标签
onreset 当用户重置表单时触发 <form>
onresize 当窗口大小被改变时触发 <body>、<iframe>
onselect 当用户选择文本框或文本域的某段文字时触发 <input>、<textarea>
onsubmit 当表单提交时触发,通常通过单击表单的“提交”按钮触发 <form>
onunload 当某个对象从窗口或框架中卸载完毕时触发 <body>、<iframe>、<img>

 

15.1.3  事件处理函数和关键字this

    JavaScript脚本通常处于window对象下运行,如果JavaScript脚本中使用this关键字,则通常引用到window本身。

    代码示范:

      //脚本代码

      window.name = "测试窗口";

      var test = function()

      {

        alert(this.name);

      }

      //HTML代码

      <button onclick="test()">测试</button>

    //点击测试按钮将会弹出“测试窗口”对话框。

15.1.4  使用返回值改变默认行为

    HTML元素大都包含了自己的默认行为。例如,单击超链接将导致页面导航到超链接所指的页面,单击表单的“提交”按钮将导致表单提交...等等

    但如果为这些元素增加对应的事件处理函数,将可以改变这种默认行为。

    例如组织超链接导航,代码示范:

      <a href="www.baidu.com" onclick="return false">导航</a>

    该超链接绑定了onclick事件处理代码,该代码简单的返回false,这将阻止超链接的导航功能,所以点击该导航超链接页面将不会跳转。

posted on 2014-08-14 20:49  My白开水  阅读(128)  评论(0)    收藏  举报