这个就是一个输入框的小练习（也是第一次写这个东西）
<!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. 用Python简单批量处理数据

    近期碰到一个问题,两套系统之间数据同步出了差错,事后才发现的,又不能将业务流程倒退,但是这么多数据手工处理量也太大了,于是决定用Python偷个小懒. 1.首先分析数据. 两边数据库字段的值都是一样, ...

  2. Spring - 数据库开发概述

      Spring 数据库开发 Spring 的 JDBC 模块负责数据库资源管理和镨误处理,大大简化了开发人员对数据库的操作,使得开发人员可以从繁琐的数据库操作中解脱出来,从而将更多的精力投入到编写业 ...

  3. 深入调研Linq to Objects Join Linq to Entity

    最近工作中遇到数据库组合查询带来的一些问题,因此有必要调研一下Linq to Objects Join Linq to Entity.参考一些网友的代码案例,深入实践了一下使用EntityFramew ...

  4. SpringBoot系列（二）入门知识

    SpringBoot系列(二)入门知识 往期推荐 SpringBoot系列(一)idea新建springboot项目 引言 本来新建springboot项目应该放在入门知识这一章的,但是由于新建spr ...

  5. SpringBoot整合Springfox-Swagger2

    前言 不管Spring Boot整合还是SpringMVC整合Swagger都基本类似,重点就在于配置Swagger,它的精髓所在就在于配置. @ 目录 1.Swagger简介 2.整合前可能遇到的问 ...

  6. 从 Linux 操作系统谈谈 IO 模型（终）

    Linux 为什么要区分内核空间与用户空间? Linux 操作系统的 IO 模型有哪几种?有啥区别? 常说的阻塞现象,到底是咋回事? 网络编程研发时,那块到底耗时最多,代码是否还有优化空间? 前几期的 ...

  7. JavaScript new 的时候到底发生了什么？

    function Person(name) { this.name = name; } let liLei = new Person('lilei'); console.log(liLiei.name ...

  8. [Vue warn]: Failed to mount component: template or render function not defined. found in ---> <XFbwz> at src/views/XFbwz.vue <App> at src/App.vue <Root>

    1.引入.vue文件忘记加.vue 2.引入文件内容为空

  9. 一夜搞懂 | JVM 线程安全与锁优化

    前言 本文已经收录到我的 Github 个人博客,欢迎大佬们光临寒舍: 我的 GIthub 博客 学习导图 一.为什么要学习内存模型与线程? 之前我们学习了内存模型和线程,了解了 JMM 和线程,初步 ...

  10. 泛型代码中的 default 关键字

    在泛型类和泛型方法中会出现的一个问题是,如何把缺省值赋给参数化类型,此时无法预先知道以下两点: l        T将是值类型还是引用类型 l        如果T是值类型,那么T将是数值还是结构 对 ...