焦点事件
获取焦点事件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 事件（一）的更多相关文章

  1. JavaScript事件代理和委托（Delegation）

    JavaScript事件代理 首先介绍一下JavaScript的事件代理.事件代理在JS世界中一个非常有用也很有趣的功能.当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委 ...

  2. JavaScript事件概览

    JavaScript事件 JavaScript是单线程,在同一个时间点,不可能同时运行两个"控制线程". 事件句柄和事件对象 1.注册事件句柄 标准和非标准 var button= ...

  3. 【移动端兼容问题研究】javascript事件机制详解（涉及移动兼容）

    前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...

  4. JavaScript 事件

    事件 概念:事件是可以被 JavaScript 侦测到的行为. JavaScript 使我们有能力创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触 ...

  5. JavaScript事件详解-jQuery的事件实现（三）

    正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...

  6. JavaScript事件详解-Zepto的事件实现（二）【新增fastclick阅读笔记】

    正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...

  7. 总结JavaScript事件机制

    JavaScript事件模型 在各种浏览器中存在三种事件模型: 原始事件模型 , DOM2事件模型 , IE事件模型. 其中原始的事件模型被所有浏览器所支持,而DOM2中所定义的事件模型目前被除了IE ...

  8. 解析Javascript事件冒泡机制

    本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...

  9. JavaScript事件流原理解析

    一.为什么会有这一篇的文章 国庆前几天由于任务比较重,要赶在国庆前把一个进度的任务开发完成,所以也就有点赶,但是却遇到了一个比较奇怪的Bug,导致了任务比预计的延迟了几个小时,对此深表遗憾,所以利用国 ...

  10. Javascript事件机制兼容性解决方案

    本文的解决方案可以用于Javascript native对象和宿主对象(dom元素),通过以下的方式来绑定和触发事件: 或者 var input = document.getElementsByTag ...

随机推荐

  1. 【Tomcat】Tomcat Session在Redis共享

    参考的优秀文章 Redis-backed non-sticky session store for Apache Tomcat 简单地配置Tomcat Session在Redis共享 我使用的是现有的 ...

  2. CentOS7 续续

    1.配置网络,虚拟机为桥接模式,IP地址为 192.168.100+学号/24,配置完成后可以通过ping物理机192.168.100段,或者ping 192.168.100.140验证2.通过临时与 ...

  3. 大分享-hibernate,springmvc,easyui简要介绍

    近期公司一直在做项目,主要用到了springMVC,eseayui,hibernate几大框架.近一个月的时间,个人就目前自我知识给予分享. 很多公司使用mybatis产品,综合所述其最大优点是全SQ ...

  4. metasploit模块功能介绍

    metasploit的模块构成及功能分析  转载自----http://forum.cnsec.org/thread-94704-1-1.html 今天我们介绍一下metasploit的基础架构和 市 ...

  5. 使用WordPress模板搭建博客系统

    综述: 前端展示:外观--->主题. 功能模块:插件. 遇到的问题: 1:无法加载编辑器文件: 切换下不同的wordPress模板,可能缓存文件有问题. 2:注册功能:密码重设链接无效bug-- ...

  6. nodejs的第二天学习笔记

    一. Shell: 1) 常用的shell a) CMD: window+r 打开面板中输入cmd 回车   特点:很多都是window下面的指令 b) powerShell:   特点:它能够兼容w ...

  7. Jqplot 使用总结之一(线条及节点颜色)

    好不容易抽出时间将Jqplot做下最后的总结,下面通过四个例子来学习Jqplot的一些常见技巧:示例1. 设置线条颜色(包括背景色及线条颜色的批量赋值) <!DOCTYPE html> & ...

  8. 如何myEclipse修改工程项目的运行环境和编译环境

    修改工程运行环境(开发环境)JRE 右击工程名-----选择properties----选择对话框左侧的java build path----查看使用的JRE 选择Library选项卡中的,选中使用中 ...

  9. Java中常用的运算符

    运算符是一种“功能”符号,用以通知 Java 进行相关的运算,Java 语言中常用的运算符可分为如下几种: 算数运算符.赋值运算符.比较运算符.逻辑运算符.条件运算符. 一.算数运算符 Java 中常 ...

  10. 学习笔记Jmail收发邮件

    一．利用Jmail发送邮件  1/// <summary> 2/// 利用Jmail发送邮件 3/// </summary> 4private void SendMailByJ ...