这个就是一个输入框的小练习（也是第一次写这个东西）
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<div class="div1">

    <input class="key" type="text" onfocus="func1()" onblur="func2()" value="请输入内容">

</div>

<script>

function func1() {

    var divs=document.getElementsByClassName("div1")[0];

    var ini=divs.getElementsByClassName("key")[0];

    if (ini.value=="请输入内容"){

        ini.value="";

    }

}

function func2() {

    var divs=document.getElementsByClassName("div1")[0];

    var ini=divs.getElementsByClassName("key")[0];

    if (ini.value.trim().length==0){

        ini.value="请输入内容";

    }

}

</script>

</body>

</html>

js输入框练习的更多相关文章

  1. JS输入框邮箱自动提示(带有demo和源码)（转载）

    今天在javascriptQQ群里面 有童鞋问到 有没有 "JS输入框邮箱自动提示"插件,即说都找遍了github上源码 都没有看到这样类似的插件,然后我想了下 "JS输 ...

  2. JS输入框邮箱自动提示(带有demo和源码)

    今天在javascriptQQ群里面 有童鞋问到 有没有 "JS输入框邮箱自动提示"插件,即说都找遍了github上源码 都没有看到这样类似的插件,然后我想了下 "JS输 ...

  3. 编写简易的JS输入框模糊查询匹配（附有源码和demo）

    前言:JS输入框模糊匹配插件以前在工作写过一个类似的 所以这次写轻松很多,这次写优化了几个方面: 1. 添加动态加载css文件 不需要引入css css全部在JS动态生成. 2. 不需要额外的标签 只 ...

  4. JS输入框正则校验

    1. 开发中需要对etl组件统一进行input输入框校验,允许为空,可以不校验,默认校验长度和特殊字符,代码如下,记录以备复用. /** * 数据值校验工具类 */ var checkService ...

  5. jquery.inputmask.js 输入框input输入内容格式限制插件

    今天使用的就是这几行代码. 利用 jquery.inputmask.js  下载地址(如果打不开的话 请FQ http://plugins.jquery.com/jquery.inputmask/) ...

  6. JS 输入框输入数字检查

    <input id='ApplyInputNum' type='text' class='mytext form-control' align='left' onblur='InputCheck ...

  7. Jquery autocomplete.js输入框联想补全功能

    Jquery autocomplete.js插件下载地址:http://files.cnblogs.com/files/jinzhiming/autocomplete.rar 有两种用法,一种是直接使 ...

  8. js 输入框增加删除操作

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. (js) 输入框只能输入中文、英文、数字、@符号和.符号

    只能输入中文.英文.数字.@符号和.符号<input type="text" onkeyup="value=value.replace(/[^\a-\z\A-\Z0 ...

随机推荐

  1. coding++：Spring Boot全局事务解释及使用（一）

    Spring 事务的入口: TxAdviceBeanDefinitionParser 解释 <tx:advice/> 这里将解析tx的配置. @Override protected Cla ...

  2. SpringBoot学习笔记（十一：使用MongoDB存储文件 ）

    @ 目录 一.MongoDB存储文件 1.MongoDB存储小文件 2.MongoDB存储大文件 2.1.GridFS存储原理 2.2.GridFS使用 2.2.1.使用shell命令 2.2.2.使 ...

  3. [一起读源码]走进C#并发队列ConcurrentQueue的内部世界

    决定从这篇文章开始,开一个读源码系列,不限制平台语言或工具,任何自己感兴趣的都会写.前几天碰到一个小问题又读了一遍ConcurrentQueue的源码,那就拿C#中比较常用的并发队列Concurren ...

  4. F - 我们什么时候能见面? POJ - 2028

    F - 我们什么时候能见面? POJ - 2028 ICPC委员会希望尽快召开会议,解决下一届比赛中的每一个小问题.然而,委员会的成员都忙于疯狂地开发(可能是无用的)程序,以至于很难安排他们的会议日程 ...

  5. A - A FZU - 2205

    A - A FZU - 2205 一个国家有 N 个城市,国王不希望国家中存在三个城市之间能够互相直接到达,但道路要求尽可能的多,道路是双向边,且无重边无自环. 国王希望你最好能解决这个问题.求最多存 ...

  6. SWUST OJ 1075 求最小生成树(Prim算法）

    求最小生成树(Prim算法) 我对提示代码做了简要分析,提示代码大致写了以下几个内容 给了几个基础的工具,邻接表记录图的一个的结构体,记录Prim算法中最近的边的结构体,记录目标边的结构体(始末点,值 ...

  7. 1-1. OSS/ALSA 声卡的驱动与配置和 Madplay 嵌入式播放器的移植

    报警子系统 一. OSS/ALSA 声卡的驱动与配置 声卡驱动中传统的OSS构架在02年被收购后即不开源,并且OSS的混音效果不好->因此ALSA构架孕育而生. ALSA(高级音频构架,目前应用 ...

  8. Java数组的声明与创建

    今天在刷Java题的时候,写惯了C++发现忘记了Java数组的操作,遂把以前写的文章发出来温习一下. 首先,数组有几种创建方式? Java程序中的数组必须先进行初始化才可以使用,所谓初始化,就是为数组 ...

  9. spring官方为什么放弃spring social项目及替代方案

    spring social 1.6之后官方不在维护该项目, spring boot 2.x之后也不在提供spring social的 Autoconfiguration. 原因: https://sp ...

  10. Vue的基本指令的使用1

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...