Javaweb中JavaScript常用的事件

最新推荐文章于 2024-05-20 21:20:55 发布

程序员-小明

最新推荐文章于 2024-05-20 21:20:55 发布

阅读量451

点赞数

本文链接：https://blog.csdn.net/qq_15124475/article/details/53463302

版权

事件的注册

<head>
<script type="text/javascript">
/*
    事件： 
        注册事件的方式：

            方式一： 直接在html元素上注册
                <body onload="ready()">

                function ready(){
                    alert("body的元素被加载完毕了..");   
                }
            </body>

            方式二：可以js代码向找到对应的对象再注册。 推荐使用。

            var bodyNode = document.getElementById("body");

            bodyNode.onload = function(){
                alert("body的元素被加载完毕");  
            } 
    */  

    </script>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body id="body">

</body>

常用的事件

<head>
<script type="text/javascript">
/*
常用的事件：

    鼠标点击相关：
        onclick 在用户用鼠标左键单击对象时触发。 
        ondblclick 当用户双击对象时触发。 
        onmousedown 当用户用任何鼠标按钮单击对象时触发。 
        onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发。 

    鼠标移动相关：
        onmouseout  当用户将鼠标指针移出对象边界时触发。 
        onmousemove 当用户将鼠标划过对象时触发。 

    焦点相关的：
        onblur 在对象失去输入焦点时触发。 
        onfocus 当对象获得焦点时触发。

    其他：
        onchange 当对象或选中区的内容改变时触发。 
        onload 在浏览器完成对象的装载后立即触发。 
        onsubmit 当表单将要被提交时触发。 
*/

    function clickTest(){
        alert("单击..");  
    }

    function dbClick(){
        alert("双击..");  
    }

    function showTime(){
        var timeSpan = document.getElementById("timeSpan");
        var date  = new Date().toLocaleString();
        timeSpan.innerHTML = date.fontcolor("red");
    }

    function hideTime(){
        var timeSpan = document.getElementById("timeSpan");
        timeSpan.innerHTML = "";
    }


    function showInfo(){
        var timeSpan = document.getElementById("userName");
        timeSpan.innerHTML = "用户名是由6位的英文与数字组成".fontcolor("green");  
    }

    function hideInfo(){
        var timeSpan = document.getElementById("userName");
        timeSpan.innerHTML = "";    
    }

    function change(){
        alert("城市改变了..");   
    }


</script>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
    <input type="button" onclick="clickTest()"  value="单击" />
    <input type="button" ondblclick="dbClick()" value="双击"/> 
    <span onmousemove="showTime()" onmouseout="hideTime()" >查看当前系统时间：</span><span id="timeSpan"></span>
    用户名<input type="text" onfocus="showInfo()"  onblur="hideInfo()" /> <span id="userName"></span>

    <select onchange="change()" >
        <option>郑州</option>
        <option>重庆</option>
        <option>杭州</option>
    </select>


</body>

程序员-小明

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javaweb中JavaScript常用的事件

事件的注册<head><script type="text/javascript"> 事件：注册事件的方式：方式一：直接在html元素上注册 <body onload="ready()"> function ready(){ alert("bod
复制链接

扫一扫