主要用到属性：onpropertychange事件（属性改变时触发的事件），oninput属性（当input有输入时发生的事件）

onpropertychange事件是IE专属事件

oninput属性兼容非IE浏览器

例如：

代码

<input id="Login_username" class="Login_input" name="Login_username" type="text" placeholder=" 输入用户名" onpropertychange="this.style.color='black'" oninput="this.style.color='black'">

<input id="Login_pwd" class="Login_input" name="Login_pwd" type="password" placeholder=" 输入密码" onpropertychange="this.style.color='black'" oninput="this.style.color='black'">

原始样式：

修改前输入效果：

自该后输入效果：

input效果：当鼠标在input中输入文字是改变内部文字效果的更多相关文章

  1. Python cmd中输入'pip' 不是内部或外部命令，也不是可运行的程序或批处理文件。

    配置一下环境变量,找到 添加一下Scripts文件夹的路径,如:这是我的路径C:\Users\ck\AppData\Local\Programs\Python\Python36 就是你python的安 ...

  2. JS实现input中输入数字，控制每四位加一个空格（银行卡号格式）

    前言 今天来讲讲js中实现input中输入数字,控制每四位加一个空格的方法!这个主要是应用于我们在填写表单的时候,填写银行卡信息,要求我们输入的数字是四位一个空格!今天主要介绍两种方式来实现这个方法! ...

  3. js控制 input框中输入数字时，累计求和

    $('.cc input').bind('input propertychange', function(){ var total = 0; $("input").each(fun ...

  4. vue时时监听input输入框中 输入内容 写法

    Vue input 监听 使用 v-on:input="change" 实现即可 App.vue <template> <div> <md-field ...

  5. input的类型为number，限制输入的数字位数

    <input type="text"  maxlength="5" />   效果ok,当 <input type="number& ...

  6. 不让input表单的输入框保存用户输入的历史记录

    如何不让input表单的输入框保存用户输入的历史记录.  有时我们在设计网页时不想让表单保存用户输入历史记录,比如一些隐私数据,或一些冲值卡 <input name="test&quo ...

  7. input框动态模糊查询，能输入，能选择

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

  8. placeholder 效果的实现，input提示字，获取焦点时消失

    <!doctype html><html><head><meta charset="utf-8"><title>plac ...

  9. 给定一个字符串，把字符串内的字母转换成该字母的下一个字母，a换成b，z换成a，Z换成A，如aBf转换成bCg， 字符串内的其他字符不改变，给定函数，编写函数 void Stringchang（const char*input,char*output）其中input是输入字符串，output是输出字符串

    import java.util.Scanner; /*** * 1. 给定一个字符串,把字符串内的字母转换成该字母的下一个字母,a换成b,z换成a,Z换成A,如aBf转换成bCg, 字符串内的其他字 ...

随机推荐

  1. error: /usr/include/objc/objc-class.h: No such file or directory

    When i use the example of ShareKit package,i have come across this error:"error: /usr/include/o ...

  2. Migration from Zend Framework v2 to v3

    Migration from Zend Framework v2 to v3 Zend Framework v2 to v3 has been intended as an incremental u ...

  3. NSURLSession、NSURLConnection

    NSURLSesstion GET方法 block回调方法NSString * urlStr = @"http://192.168.1.247:8100/stream?cname=cha_2 ...

  4. 深入研究Block捕获外部变量和__block实现原理

    Blocks是C语言的扩充功能,而Apple 在OS X Snow Leopard 和 iOS 4中引入了这个新功能“Blocks”.从那开始,Block就出现在iOS和Mac系统各个API中,并被大 ...

  5. MySQL（4）：数据表创建

    数据库是表的容器,表,必须属于某个数据库. 可以通过.语法,指明数据表所属的数据库 比如:database.table 进行表操作的时候,都会指定当前的默认数据库. use db_name; 1.创建 ...

  6. 获取mp4文件信息

    计算电影长度 方法1 从mvhd - movie header atom中找到time scale和duration,duration除以time scale即是整部电影的长度. time scale ...

  7. 【shell】 I/O重定向

    1.基本概念  a.I/O重定向通常与 FD有关,shell的FD通常为10个,即 0-9:  b.常用FD有3个,为0(stdin,标准输入).1(stdout,标准输出).2(stderr,标准错 ...

  8. javascript开发中的封装模式（转）

    var bgAuido={ audio : pingfan.$$('audio'), audioBtn : pingfan.$$('audioBtn'), init : function(){ var ...

  9. 关于JDBC链接数据库的代码实现

    /** * 快速入门 */ @Test public void demo1() { /** * * 1.加载驱动. * * 2.获得连接. * * 3.编写sql执行sql. * * 4.释放资源. ...

  10. MATLAB的循环结构

    循环结构有两种基本形式:while 循环和for 循环.两者之间的最大不同在于代码的重复是如何控制的.在while 循环中,代码的重复的次数是不能确定的,只要满足用户定义的条件,重复就进行下去.相对地 ...