Javascript 事件(一)
焦点事件
获取焦点事件onfocus \ 失去焦点事件 onblur
使浏览器能够区分用户输入的对象,当一个元素有焦点的时候,那么他就可以接收用户的输入。
我们可以通过一些方式给元素设置焦点
1.点击
2.tab
3.js
不是所有元素都能够接收焦点的.能够响应用户操作的元素才有焦点
焦点事件例子 :
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
window.onload = function() { var oText = document.getElementById('text1'); //onfocus : 当元素获取到焦点的时候触发
oText.onfocus = function() { if ( this.value == '请输入内容' ) {
this.value = '';
} } //onblur : 当元素失去焦点的时候触发
oText.onblur = function() { if ( this.value == '' ) {
this.value = '请输入内容';
} } /*
obj.focus() 给指定的元素设置焦点
obj.blur() 取消指定元素的焦点
obj.select() 选择指定元素里面的文本内容
*/
oText.focus(); var oBtn = document.getElementById('btn'); oBtn.onclick = function() { oText.select(); } }
</script>
</head> <body>
<input type="text" id="text1" value="请输入内容" />
<input type="button" value="全选" id="btn" />
</body>
</html>
Javascript 事件(一)的更多相关文章
- JavaScript事件代理和委托(Delegation)
JavaScript事件代理 首先介绍一下JavaScript的事件代理.事件代理在JS世界中一个非常有用也很有趣的功能.当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委 ...
- JavaScript事件概览
JavaScript事件 JavaScript是单线程,在同一个时间点,不可能同时运行两个"控制线程". 事件句柄和事件对象 1.注册事件句柄 标准和非标准 var button= ...
- 【移动端兼容问题研究】javascript事件机制详解(涉及移动兼容)
前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...
- JavaScript 事件
事件 概念:事件是可以被 JavaScript 侦测到的行为. JavaScript 使我们有能力创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触 ...
- JavaScript事件详解-jQuery的事件实现(三)
正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...
- JavaScript事件详解-Zepto的事件实现(二)【新增fastclick阅读笔记】
正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...
- 总结JavaScript事件机制
JavaScript事件模型 在各种浏览器中存在三种事件模型: 原始事件模型 , DOM2事件模型 , IE事件模型. 其中原始的事件模型被所有浏览器所支持,而DOM2中所定义的事件模型目前被除了IE ...
- 解析Javascript事件冒泡机制
本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...
- JavaScript事件流原理解析
一.为什么会有这一篇的文章 国庆前几天由于任务比较重,要赶在国庆前把一个进度的任务开发完成,所以也就有点赶,但是却遇到了一个比较奇怪的Bug,导致了任务比预计的延迟了几个小时,对此深表遗憾,所以利用国 ...
- Javascript事件机制兼容性解决方案
本文的解决方案可以用于Javascript native对象和宿主对象(dom元素),通过以下的方式来绑定和触发事件: 或者 var input = document.getElementsByTag ...
随机推荐
- [CCF] Z字形扫描
CCF Z字形扫描 感觉和LeetCode中的ZigZag还是有一些不一样的. 题目描述 在图像编码的算法中,需要将一个给定的方形矩阵进行Z字形扫描(Zigzag Scan).给定一个n×n的矩阵,Z ...
- python(六)内置函数
一.函数知识补充 函数不设置值,默认返回None:函数中参数都是按引用传递,函数里修改了参数,原始参数也会修改. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 1 ...
- Annotation
Annotation是给类,方法或域上加的一种特殊的标记,可以通过反射取到注解的类型和值,从而完成某种特定的操作. 定义注解需要使用元注解,元注解有@Retention和@Target p.p1 { ...
- ArcgisAdd-In开发入门实例
1.开发环境 Vs2012+Arcgis10.2+win7 64bit 2.实现代码 首先在VS2012中新建一个解决方案,命名AddInTest. 接着,给解决方案AddInTest新建一个项目: ...
- PHP操作MySQL的常用函数
某些情况下(如html中),调用php的变量时,要给变量加{},若要使字符串变量加上引号,则还需要在{}外加引号 如: $sql="select * from admin where use ...
- php的rss订阅
一般来说我们很少自己造轮子,读取rss还是用git上的开源库吧 https://github.com/dg/rss-php 这个开源库不能读取博客园的rss订阅,新浪微博的格式显示有问题. 博客园的订 ...
- OpenGL的glTexImage2D()与gluBuild2DMipmaps()的使用方法及区别
OpenGL的glTexImage2D()与gluBuild2DMipmaps()的使用方法及区别 说明:两者的都是生成纹理,即:将载入的位图文件(*.bmp)转换成纹理贴图. 1.glTexImag ...
- Ant-style path patterns
[转载]http://blog.itpub.net/29959940/viewspace-1385870/ Ant path 匹配原则路径匹配原则(Path Matching) Spring MVC中 ...
- 20161026__Oracle10g_DataGuard
1. orcl.__db_cache_size=180355072 orcl.__java_pool_size=4194304 orcl.__large_pool_size=4194304 orcl. ...
- STL中的查找算法
STL中有很多算法,这些算法可以用到一个或多个STL容器(因为STL的一个设计思想是将算法和容器进行分离),也可以用到非容器序列比如数组中.众多算法中,查找算法是应用最为普遍的一类. 单个元素查找 1 ...