主要用到属性: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. ArrowDrawable

    https://github.com/wly2014/ArrowDrawable https://github.com/ChrisRenke/DrawerArrowDrawable

  2. android学习日记13--数据存储之SQLite

    2.SQLite 开源轻量级数据库,支持92-SQL标准,主要用于嵌入式系统,只占几百K系统资源此外,SQLite 不支持一些标准的 SQL 功能,特别是外键约束(FOREIGN KEY constr ...

  3. 跟我学solr---吐槽一下,我的文章被抄袭啦

    今天闲来无事,就在在百度上搜了下面"跟我学solr",看看这几周来自己的努力成果怎么样,不搜还好,搜了就图学了.被原封不动地抄袭了!并且抄袭的文章还在百度排名第一,我自己的却被排到 ...

  4. 隐式Intent实例

    注意:The <strong>categories</strong>, if supplied, must <em>all</em> be listed ...

  5. Linux下各种常见环境变量的配置

      Linux系统下各种环境变量都通过修改/etc/profile文件来实现.由于是系统文件,修改此文件需要root权限.因此实现以下功能都需要用户拥有root权限. 另:不要轻易修改profile文 ...

  6. Java基础知识强化之网络编程笔记16:Android网络通信之 使用Http的Get方式读取网络数据(基于HTTP通信技术)

    使用Http的Get方式读取网络数据,使用Get方式与网络通信是最常见的Http通信,建立链接之后就可以通过输入流读取网络数据. 详见:Android(java)学习笔记209:采用get请求提交数据 ...

  7. Redis & Sentinel 安装脚本

    #!/bin/bash # 判断是否为root用户,不是root用户提示退出 if [[ $EUID -ne 0 ]]; then    echo "This script. must be ...

  8. linux系统安装(虚拟机以及linux的下载与安装)

    最近开始研究linux系统,以前接触linux系统只是一些简单的命令,例如: pwd:查看当前目录   ls:遍历目录    cd :在目录之间切换等. linux系统是基于unix系统开发的,是一个 ...

  9. iframe实现面页无刷新提交表单

    一.表单提交到了哪里? 这似乎是个无知的问题,我们都知道表单提交到服务器,java,php,asp等服务器,然后由服务器去读.那么之后呢,服务器总要返回点什么吧,要么返回 一个xml或json数据,要 ...

  10. 使用jvisualvm和飞行记录器分析Java程序cpu占用率过高

    一.jvisualvm使用 JDK1.6中Oracle提供了一个新的JVM监控工具:jvisualvm.下面重点介绍如何在本地通过远程的方式打开Linux服务器上的jvisualvm. 1.Xmana ...