zoukankan      html  css  js  c++  java
  • Javascript 笔记与总结(2-14)事件

    常用事件:

    ● onclick 元素点击时

    ● onfocus 元素获得焦点时

    ● onblur 元素失去焦点时

    ● onmouseover 鼠标经过时

    ● onsubmit 表单提交时(<form onsubmit="return func();"></form>)

    ● onload 页面加载完毕时

    注:onsubmit = "return func()";  func() 函数才能阻拦提交的结果。

    【例】onload 的缺点:

    img.php,用于展示图片,这里让图片 5 秒之后输出

    <?php
    $img = imagecreatetruecolor(300, 300); //创建一个300 * 300 px 的黑色方块
    sleep(5); //5 秒之后输出
    header("content-type:image/png");
    imagepng($img);

    test.html,引用图片,同时使用 onload 事件改变文字效果

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script>
            function t(){
                document.getElementById("p").style.fontWeight = "bold";
            }
        </script>
    </head>
    <body onload="t();">
        <img src="img.php" alt="">
        <p id="p">定时改变文字</p>                
    </body>
    </html>      

    此时访问 test.html,页面显示:

    5 秒之后:

    结论:onload 事件必须要等页面内所关联的 比如 src 引用来的不论是本站还是外站的全部的元素都加载完毕之后,才执行。

    附:sublime (text2 | test3)快捷键:

    ① 输入:

    p>input:text

    按 tab ,得到:

    <p><input type="text" name="" id=""></p>

    ② 输入:

    p*2>input:text

    按 tab,得到:

    <p><input type="text" name="" id=""></p>
    <p><input type="text" name="" id=""></p>
  • 相关阅读:
    CSS3box-shadow属性的使用
    IE7下z-index失效问题
    CSS3的writing-mode属性
    eclipse Java EE安装和web项目的创建
    用JS去掉前后空格或中间空格大全
    webstorm自带debugger服务器
    用meta标签让网页用360打开时默认为极速模式
    移动端可拖动导航菜单小demo
    DCL并非单例模式专用
    领域专用语言
  • 原文地址:https://www.cnblogs.com/dee0912/p/4471961.html
Copyright © 2011-2022 走看看