<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<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>

</html>

javascript之常用事件的更多相关文章

  1. Javascript中常用事件集合和事件使用方法

    Javascript中常用事件集合和事件使用方法 一.事件绑定 格式: 事件源 . on事件类型=事件处理函数 事件绑定三要素 1.事件源:和谁绑定 2.事件类型:什么事件 3.事件处理函数:触发了要 ...

  2. Javascript中常用事件的命名

    OnClick :单击事件 OnChange:改变事件 OnSelect:选中事件 OnFocus:获得焦点事件 OnBlur:失去焦点事件 Onload:载入文件 OnUnload:卸载文件 anc ...

  3. 学习笔记：javascript body常用事件

    Window 事件属性 针对 window 对象触发的事件(应用到 <body> 标签): 属性 值 描述 onafterprint script 文档打印之后运行的脚本. onbefor ...

  4. javascript页面常用事件

    事件名称 描述 onload和 onunload(已过时) 当用户进入或离开页面时就会触发onload和onunload事件,onload是页面所有元素都加载完之后才加载onload onfocus, ...

  5. javascript的常用事件

  6. JavaScript交互式网页设计 • 【第2章 JavaScript函数与事件】

    全部章节   >>>> 本章目录 2.1 JavaScript 自定义函数 2.1.1 函数的定义 2.1.2 函数的调用 2.1.3 函数的参数 2.1.4 函数的返回值 2 ...

  7. 请写出JavaScript中常用的三种事件。

    请写出JavaScript中常用的三种事件. 解答: onclick,onblur,onChange

  8. JavaScript基础之常用事件

    js 基础之常用事件 在js当中,事件是较为常用的内容,本篇文章来说一些常用的事件. 鼠标事件 下面是常用的鼠标事件: click 当用户按下并释放鼠标按键或其他方式"激活"元素时 ...

  9. javascript中常用的DOM事件

    //常用事件 onclick 点击事件 onmousedown 鼠标按下 onmousemove 鼠标移动 onmouseup 鼠标抬起 onmouseover 鼠标放上 onmouseout 鼠标放 ...

随机推荐

  1. 性能测试分析工具nmon文件分析时报错解决办法

    1.使用nmon analyzer V334.xml分析数据时,如果文件过大,可以修改Analyser页签中的INTERVALS的最大值: 2.查找生成的nmon文件中包含的nan,删掉这些数据(需要 ...

  2. 内核模式构造-Event构造（WaitLock）

    internal sealed class SimpleWaitLock:IDisposable { //Enter()和Leave()中使用m_AutoResetEvent都将迫使调用线程做用户模式 ...

  3. libusb_bulk_transfer 说明

    libusb_bulk_transfer函数说明   API_EXPORTED int libusb_bulk_transfer(struct libusb_device_handle *dev_ha ...

  4. Android studio测试软件——Monkey学习及运用

    Android studio测试软件——Monkey学习及运用 在第十五周的个人博客上,王老师安排我们根据最终的团队大作业所用的软件(Android studio)进行软件测试的介绍,而我选择的是基于 ...

  5. Docker 运行ELK日志监测系统，汉化Kibana界面

    1.ELK日志监控简介 ELK由Elasticsearch.Logstash和Kibana三部分组件组成: Elasticsearch是个开源分布式搜索引擎,它的特点有:分布式,零配置,自动发现,索引 ...

  6. 解决laydate动态设置初始值的问题

    //初始化//注意:我这里是时间范围选择,所以定义了range属性.var timeScope = laydate.render({ elem: '#time_scope', range: '~', ...

  7. jupyter lab 报错

    C:\Users\WQBin>jupyter lab [I :: kernels found [I :: No cio_test package found. [I ::45.137 LabAp ...

  8. logback.xml 配置详解（转）

    <?xml version="1.0" encoding="UTF-8"> <configuration> <!-- 设置控制台日 ...

  9. Codeforces Round #449 [ C/A. Nephren gives a riddle ] [ D/B. Ithea Plays With Chtholly ]

    PROBLEM C/A. Nephren gives a riddle 题 http://codeforces.com/contest/896/problem/A codeforces 896a 89 ...

  10. C# Lambda Left Join AND Group by Then Sum

    var list = List1.Join( List2, l1 => new { l1.Cityid }, l2 => new { l2.Cityid }, (item1, item2) ...