• 浏览器事件 明天


    浏览器事件指载入文档直到该文档被关闭期间的浏览器事件,如浏览器载入文档事件onload、关闭该文档事件onunload、浏览器失去焦点事件onblur、获得焦点事件onfocus 等。

    浏览器事件
    浏览器事件指载入文档直到该文档被关闭期间的浏览器事件,如浏览器载入文档事件onload、关闭该文档事件onunload、浏览器失去焦点事件onblur、获得焦点事件onfocus 等。
    先考察如下的代码:

     //源程序3.1
    <! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
    "
    http://www.w3.org/TR/REC-html140/strict.dtd
    ">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>Sample Page!</title>
    <script type="text/javascript">
    <!--
    window.onload = function ()
    {
    var msg="\nwindow.load 事件 : \n\n";
    msg+=" 浏览器载入了文档!";
    alert(msg);
    }
    window.onfocus = function ()
    {
    var msg="\nwindow.onfocus 事件 : \n\n";
    msg+=" 浏览器取得了焦点!";
    alert(msg);
    }
    window.onblur = function ()
    {
    var msg="\nwindow.onblur 事件 : \n\n";
    msg+=" 浏览器失去了焦点!";
    alert(msg);
    }
    window.onscroll = function ()
    {
    var msg="\nwindow.onscroll 事件 : \n\n";
    msg+=" 用户拖动了滚动条!";
    alert(msg);
    }
    window.onresize = function ()
    {
    var msg="\nwindow.onresize 事件 : \n\n";
    msg+=" 用户改变了窗口尺寸!";
    alert(msg);
    }
    //-->
    </script>
    body>
    <br>
    <p>载入文档:</p>
    <p>取得焦点:</p>
    <p>失去焦点:</p>
    <p>拖动滚动条:</p>
    <p>变换尺寸:</p>
    </body>
    </html>

    将上述源程序保存为*.html(或*.htm)文档,双击该文档后系统调用默认的浏览器进行浏览。
    当载入该文档时,触发 window.load 事件,弹出警告框如图3.2 所示。

    图 3.2 载入文档时触发window.load 事件
    当把焦点给该文档页面时,触发 window.onfocus 事件,弹出警告框如图3.3 所示。

    图 3.3 文档取得焦点时触发window.onfocus 事件
    当该页面失去焦点时,触发 window.blur 事件,弹出警告框如图3.4 所示。

    图3.4 文档失去焦点时触发window.onblur 事件
    当用户拖动滚动条时,触发 window.onscroll 事件,弹出警告框如图3.5 所示。

    图 3.5 拖动滚动条,触发window.onscroll 事件
    当用户改变文档页面大小时,触发 window.onresize 事件,弹出警告框如图3.6 所示。

    图 3.6 改变文档页面大小,触发window.onresize 事件
    浏览器事件一般用于处理窗口定位、设置定时器或者根据用户喜好设定页面层次和内容等场合,在页面的交互性、动态性方面使用较为广泛。
    注意:Netscape Navigator 4 支持window.onmove 事件,该事件在当前浏览器窗口被用户移动时触发,主
    要用于窗口的定位方面。Internet Explorer 不支持window.onmove 事件。

  • 相关阅读:
    JavaScript 开发的45个经典技巧
    LINQ
    迭代器
    【工具篇】抓包中的王牌工具—Fiddler (1-环境搭建)
    浏览器本地数据库 IndexedDB 基础详解
    Python爬虫实践 -- 记录我的第二只爬虫
    美团App用户界面分析
    APP测试要点—UI、功能测试
    Emmagee--APP性能测试工具的基本使用
    APP测试工具与技术
  • 原文地址:https://www.cnblogs.com/spiritualWindows/p/2426031.html
Copyright © 2020-2023  润新知