JavaScript_HTML DEMO_2_事件
如需在用户点击某个元素时执行代码,请向一个HTML事件属性添加JavaScript代码 OnClick=JavaScriptcript
对事件做出反应
HTML事件属性
使用HTML DOM来分配事件
Onload/Onunload事件
Onchange事件
Onmouseover/Onmouseout事件
<body onload="checkCookies()">
<p onclick="this.innerHTML='谢谢'">对事件做出反应</p>
<p id="d1" onclick="changetext()">HTML事件属性</p>
<p id="d2">使用HTML DOM来分配事件</p> 请输入英文字符:<input type="text" id="fname" onchange="myfunction()" />
<p>当你离开输入字段时,会触发将输入文本转换为大写的函数。</p> <div onmouseover="mOver(this)" onmouseout="mOut(this)" style="background-color:
green;width:120px;height:20px;padding:40px;color:#ffffff;">把鼠标移到上面</div> <div onmousedown="mDown(this)" onmouseup="mUp(this)" style="background-color:
blue;color:#ffffff;width:90px;height:20px;padding:40px;font-size:12px;">请点击这里</div>
<script>
function changetext()
{
document.getElementById("d1").innerHTML = Date();
} document.getElementById("d2").onclick = function () { displaytext(this) };
function displaytext(obj)
{
obj.innerHTML = "成功";
} //onload 和 onunload 事件会在用户进入或离开页面时被触发。
function checkCookies()
{
if(navigator.cookieEnabled==true)
{
alert("已启用 cookie");
}
else
{
alert("未启用cookie");
}
} //onchange事件常结合对输入字段的验证来使用
function myfunction()
{
var x = document.getElementById("fname");
x.value = x.value.toUpperCase();
} //onmouseover和onmouseout事件可用于在用户的鼠标移至HTML元素的上方或移出元素时触发函数
function mOver(obj)
{
obj.innerHTML = "谢谢";
}
function mOut(obj)
{
obj.innerHTML = "把鼠标移到上面";
} //onmousedown、onmouseup和onclick
function mDown(obj)
{
obj.style.backgroundColor = "#1ec5e5";
obj.innerHTML = "请释放鼠标按钮";
}
function mUp(obj)
{
obj.style.backgroundColor = "blue";
obj.innerHTML = "请按下鼠标按钮";
} </script> </body>
JavaScript_HTML DEMO_2_事件的更多相关文章
- JNI详解---从不懂到理解
转载:https://blog.csdn.net/hui12581/article/details/44832651 Chap1:JNI完全手册... 3 Chap2:JNI-百度百科... 11 C ...
- Jquery的点击事件,三句代码完成全选事件
先来看一下Js和Jquery的点击事件 举两个简单的例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...
- 关于 Chrome 浏览器中 onresize 事件的 Bug
我在写插件时用到了 onresize 事件,在反复地测试后发现该事件在 Chrome 及 Opera(内核基本与 Chrome 相同,以下统称 Chrome)浏览器打开时就会执行,这种情况也许不能算作 ...
- MVVM设计模式和WPF中的实现(四)事件绑定
MVVM设计模式和在WPF中的实现(四) 事件绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...
- C++中的事件分发
本文意在展现一个C++实现的通用事件分发系统,能够灵活的处理各种事件.对于事件处理函数的注册,希望既能注册到普通函数,注册到事件处理类,也能注册到任意类的成员函数.这样在游戏客户端的逻辑处理中,可以非 ...
- 移动端IOS点击事件失效解决方案
解决方案 解决办法有 4 种可供选择: 1 将 click 事件直接绑定到目标元素(即 .target)上 2 将目标元素换成 <a> 或者 button 等可点击的元素 3 将 clic ...
- Android笔记——Button点击事件几种写法
Button点击事件:大概可以分为以下几种: 匿名内部类 定义内部类,实现OnClickListener接口 定义的构造方法 用Activity实现OnClickListener接口 指定Button ...
- HTML 事件(一) 事件的介绍
本篇主要介绍HTML中的事件知识:事件相关术语.DOM事件规范.事件对象. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三 ...
- HTML 事件(二) 事件的注册与注销
本篇主要介绍HTML元素事件的注册.注销的方式. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三) 事件流.事件委托 4. ...
随机推荐
- Netbeans使用UTF-8编码
如果要NetBeans用UTF-8对文件进行解码,需要修改配置文件,具体方法如下: 1. 找到你的Netbeans安装目录下的etc文件夹,如C:\Program Files\NetBeans 6.9 ...
- 机器学习--PCA降维和Lasso算法
1.PCA降维 降维有什么作用呢?数据在低维下更容易处理.更容易使用:相关特征,特别是重要特征更能在数据中明确的显示出来:如果只有两维或者三维的话,更便于可视化展示:去除数据噪声降低算法开销 常见的降 ...
- C# 原码与补码的转换
/// <summary> /// 求一个16位数数的补码 /// </summary> /// <param name="OriginalCode" ...
- SuperSocket框架中BinaryRequestInfo协议的使用
一.开发环境 1.Windows 10 企业版 64位 2.Microsoft Visual Studio 2017 企业版 二.项目开始 1.新建控制台程序,项目名称“BinarySuperSock ...
- vue,webpack,node间的关系
针对在“思否”上看到的关于vue,node,webpack的一些问题及回复,做出如下的整理,给同样不是很清楚的朋友做了解,也供自己学习 原链接:https://segmentfault.com/q/1 ...
- vue -- 父子组件间的事件触发
1.父组件触发子组件事件 Parent.vue <child ref="child"></child> <div @click="fn&qu ...
- 学习笔记:首次进行JUnit+Ant构建自动的单元测试(二)
关键字:JUnit,Ant,单元测试 终于把JUnit+Ant构建单元测试的大概了解了,其实我实践的过程是对了,只是指导博客(看到这里不懂请看我上一篇博客)本身的错误“成功”把我带入“坑”,有时候网友 ...
- python的virtualenv环境与使用
1.安装virtualenv 在安装virtualenv之前,我们需要安装至少有一个版本的Python:因为virtualenv是python的一个第三方模块,必须基于python环境才能安装: 如果 ...
- Solr 6.7学习笔记(02)-- 配置文件 managed-schema (schema.xml)(3)
5. <fieldType> fieldType主要定义了一些字段类型,其name属性值用于前面<field>中的type属性的值.e.g. <fieldTyp ...
- 强联通分量之kosaraju算法
首先定义:强联通分量是有向图G=(V, E)的最大结点集合,满足该集合中的任意一对结点v和u,路径vu和uv同时存在. kosaraju算法用来寻找强联通分量.对于图G,它首先随便找个结点dfs,求出 ...