【学习笔记】JS进阶语法一事件基础

内容整理自《从0到1Javascript快速上手》下半部分-进阶语法篇

示例：键盘松开一瞬间触发的事件

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>键盘松开事件</title><script>window.onload = function(){var oTxt = document.getElementById("txt");var oNum = document.getElementById("num"); oTxt.onkeyup = function(){var str = oTxt.value;oNum.innerHTML = str.length;};}</script></head><body>请输入字符:<input id="txt" type="text"  /><div>字符串长度为：<span id="num">0</span></div></body>
</html>

示例：表单获取/失去焦点事件

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>表单获取/失去焦点事件</title><style type="text/css">#search{color:#bbbbbb;}</style><script>window.onload = function (){var oSearch = document.getElementById("search");//var oBtn = document.getElementById("btn"); //获取焦点oSearch.onfocus = function (){if (this.value == "百度一下，你就知道"){this.value = "";}};//失去焦点oSearch.onblur = function (){if (this.value == ""){this.value = "百度一下，你就知道";}                 };}</script></head><body><input id="search" type="text" value="百度一下，你就知道" /><input id="btn" type="button" value="搜索" /></body>
</html>

【学习笔记】JS进阶语法一事件基础相关推荐

【学习笔记】JS进阶语法一事件进阶
内容整理自<从0到1Javascript快速上手>下半部分-进阶语法篇示例:event对象keyCode属性获取键盘上下左右键 <!DOCTYPE html> <htm ...
Java学习笔记：进阶语法
文章目录一.对象内存管理: ①堆内存: ②垃圾回收机制: ③栈: ④方法区: 二.Debug调试: 三.API文档: ①JDK API: ②文件注释规范: ③导出项目的JavaDoc文档: 四.字符 ...
HiveQL学习笔记（二）：Hive基础语法与常用函数
本系列是本人对Hive的学习进行一个整理,主要包括以下内容: 1.HiveQL学习笔记(一):Hive安装及Hadoop,Hive原理简介 2.HiveQL学习笔记(二):Hive基础语法与常用函数 ...
前端学习:学习笔记(JS部分）
前端学习:学习笔记(JS部分) 前端学习:JS学习总结(图解) JS的简介 JS基本语法 JS内置对象 JS的函数 JS的事件 JS的BOM JS的DOM JS的简介新建步骤 <body ...
jQuery学习笔记之DOM操作、事件绑定（2）
jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定源码地址: https ...
python基本语法语句-python学习笔记：基本语法
原标题:python学习笔记:基本语法缩进:必须使用4个空格来表示每级缩进,支持Tab字符 if语句,经常与else, elif(相当于else if) 配合使用. for语句,迭代器,依次处理迭代 ...
js进阶 10-4 jquery中基础选择器有哪些
js进阶 10-4 jquery中基础选择器有哪些一.总结一句话总结: 1.群组选择器用的符号是什么? 群组选择器,中间是逗号 2.jquery中基础选择器有哪些? 5种,类,id,tag,群组, ...
jqGrid 学习笔记整理——进阶篇（一）
jqGrid 学习笔记整理--进阶篇(一 ) 本篇为基础篇的扩展,使其具有增.删.改.查的基本功能. 在浏览导航栏添加所需按钮 <!DOCTYPE html> <html>&l ...
Programming Languages PartA Week2学习笔记——SML基本语法
Programming Languages PartA Week2学习笔记--SML基本语法首先简单介绍使用的SML语言,参考维基百科和百度百科: ML(Meta Language:元语言)是由爱丁 ...

【学习笔记】JS进阶语法一事件基础

【学习笔记】JS进阶语法一事件基础相关推荐

最新文章

热门文章