JS 03事件
<script type="text/javascript">
function getUserInput() {
//获取用户输入的内容
var val = document.getElementById("userinput").value
//根据用户输入的内容播放相应的动画
playAnimate(val);
}
function playAnimate(str){
if(str=="黑洞"){
alert("播放反转的动画")
}else if(str=="反转"){
alert("播放反转动画");
}
}
</script>
<body>
<input id="userinput" type="text"/>
<input type="button" value="百度一下" onclick="getUserInput();">
</body>
onclick单机事件
//一个事件可以触发多个函数
function test1() {
//单击事件onclick：常用html标签是button标签、a标签、img标签
alert('nihao')
}
function test2() {
alert("世界");
} <button type="button" onclick="test();">点我测试</button>
<a href="javascript:void(0);" onclick="test1();test2();">点我测试2</a>
ondblick双击事件
//一个html元素可以绑定多个事件
function testDouble() {
//双击事件ondblclick：常用html标签是button标签、a标签、img标签
alert("我被双击了！")
}
<input type="button" value="点我测试双击" ondblclick="testDouble()">
<button type="button" ondblclick="testDouble();">点我测试双击</button>
onfocus成为焦点，onblur失去焦点
function testFocus() {
//获取焦点事件onfocus：常用的HTML标签有<input type="text">
console.log("万众瞩目");
}
function testOnblur(){
//丢失焦点事件onblur: 常用的html标签有<input type="text">
console.log("无人问津")
}
<input type="text" onfocus="testFocus();" onblur="testOnblur()"/>
onchange选中对象的值发生变化
function testOnchange() {
//html的value发生变化的事件：常用html标签有select
console.log("用户重新选择了城市")
}
<select onchange="testOnchange()">
<option value="1">广州</option>
<option value="2">上海</option>
<option value="3">北京</option>
</select>
<input type="text" onchange="testOnchange()"/>
onload页面装载
function testOnload() {
//页面加载事件：常用的html标签是body
console.log("页面加载...")
}
<body onload="testOnload()">
onmousemove鼠标移动
<style type="text/css">
#myDiv {
width: 300px;
height: 500px;
border: 1px solid grey;
background-image: url("timg.jpg");
}
</style>
<script type="text/javascript">
function fj(eve) {
var e = window.event || eve;
var x = e.pageX || e.x;
var y = e.pageY || e.y;
console.log(x + "--" + y);
}
</script>
<div id='myDiv' onmousemove="fj(event);"> </div>
onmouseeout 出去
onmousewheel滑动滚轮
onkeydown按键盘
JS 03事件的更多相关文章
- 探讨Js的事件的冒泡阶段
近来看到了一个新的知识点叫Js的事件冒泡,因此决定自己来研究一番. 大家应该都知道,Js中的事件处理分为三个阶段,1:事件的捕获阶段,2:处于目标阶段,3:事件的冒泡阶段.那么什么是事件的捕获和冒泡呢 ...
- 浅谈js的事件冒泡机制
很多人都听说过,js的事件冒泡机制,其实,这个说法还是比较生动形象的,就是一个水泡在水底下,冒泡到水面的过程. 那js的事件冒泡机制呢,就是一个DOM树,一级一级向上冒的过程,最终是到document ...
- js键盘事件全面控制详解
js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件 ...
- Js 冒泡事件阻止
Js 冒泡事件阻止 1. 事件目标 现在,事件处理程序中的变量event保存着事件对象.而event.target属性保存着发生事件的目标元素.这个属性是DOM API中规定的,但是没有被所有浏览 ...
- js event 事件兼容浏览器 ie不需要 event参数 firefox 需要
js event 事件兼容浏览器 ie不需要 event参数 firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...
- JS通用事件监听函数
JS通用事件监听函数 版本一 //把它全部封装到一个对象中 var obj={ readyEvent:function (fn){ if(fn==null){ fn=document; } var o ...
- js键盘事件全面控制
js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件类型 ...
- js键盘事件全面控制详解【转】
js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件类型 ...
- js 鼠标事件的抓取代码
js 鼠标事件的抓取代码,分享给大家. 1.通过ele.setCapture();设置鼠标事件的抓取. 2,应用可以通过单.双击文字来获取时间. <html> <head> & ...
随机推荐
- java实例化对象的过程
总结以上内容,可以得到对象初始化过程: 1. 如果存在继承关系,就先父类后子类: 2 .如果在类内有静态变量和静态块,就先静态后非静态,最后才是构造函数: 3 .继承关系中,必须要父类初始化完成 ...
- [RK3399] 修改移动网络默认为4G
CPU:RK3399 系统:Android 7.1 现在手机卡都默认是 4G 网路,但是源码中默认的还是 3G网络,每次都要手动改到 4G. 下面在源码中就直接将默认网络改为4G. PREFERRED ...
- CentOS7 修改设置静态IP和DNS
最近因为学习Puppet,用虚拟机装了个CentOS,使用的NAT的网络模式,为了防止再次启动系统的时候网络IP发生变化,因此设置静态IP和DNS. 由于CentOS是最小化安装,没有ifconfig ...
- perl 语法速查 | 模块安装
perl -MCPAN -e shell install Bio::SeqIO 或者直接perl -MCPAN -e 'install Excel::Writer::XLSX' 用cpan装不上,编译 ...
- JAVA_SWT 事件的四种写法
一:匿名内部类写法 在一个组件下加入以下语句 text.addMouseListener(new MouseAdapter(){ public void mouseDoubleClich(MouseE ...
- 安卓打包apk
打apk包的环境依赖 1.jdk 2.sdk 3.ndk 打apk包的工具 gradle mkdir /usr/local/Android cd /usr/local/Android mkdir sd ...
- Webservice初体验：axis调用wsdl和document解析
Neo君遇到了需要调用webservice接口的情况,然而作为一只小白对这方面了解困乏,经过摸索,完成了一个小的Demo,记录下. 一:背景 同事给了我一个webservice地址,打开后后缀是&qu ...
- ColorMatrix图片饱和度设置
package com.loaderman.customviewdemo; import android.app.Activity; import android.graphics.Bitmap; i ...
- final和finally和finalize的区别
final 修饰类,不能被继承 修饰方法,不能被重写 修饰变量,只能赋值一次 finally 是try语句中的一个语句体,不能单独使用,用来释放资源 finalize 是一个方法,当垃圾回收器确定不存 ...
- String,StringBuilder 和StringBuffer区别
1. String 和字符串缓冲区的区别是: String 是一个不可变的字符序列 , 而字符串缓冲区是可变的 2. StringBuffer 是一个线程安全的可变字符序列 ; 线程安全对应的效率低 ...