<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>JS练习题</title>

 <script src="../jquery-1.11.2.min.js"></script><!--引入jquery包-->

 </head>

 <body>

 题目：创建4个文本框，当文本框内没有内容的时候显示白色，有输入内容时换色

     <div>

         <!--先在一个div里面创建4个文本框-->

         <input type="text" class="txt" />

         <input type="text" class="txt" />

         <input type="text" class="txt" />

         <input type="text" class="txt" />

     </div>

 </body>

 <script type="text/javascript">

 $(document).ready(function(e) {

         //假日一个使文本框失去焦点的事件

         $(".txt").blur(function() {

             if($(this).val().trim() !="")

             {

                 $(this).css("background-color","#0FF");    //在文本框内输入内容，文本框的颜色就变成#0FF颜色

             }

             else

             {

                 $(this).css("background-color","#C0F");//在文本框内不输入内容（进行了去空格处理）或者空字符串，文本框的颜色就变成#C0F颜色

             }

         });

 });

 </script>

 </html>

JS练习 改变文本框状态的更多相关文章

  1. 用JS实现改变文本框的只读属性

    <input id="aaa" readonly><input id="bbb" readonly> <script>doc ...

  2. 怎么用js代码改变单选框的选中状态

    今天突然有一个需求要用到,使用js代码改变单选框的选中状态.当时想也不想直接 function doGender(gender) { if (gender == "男") { ge ...

  3. js/jquery获取文本框的值与改变文本框的值

    我们就用它来学习获取文本框的值及改变文本框的值. 代码如下 复制代码 <script>function get1(){ document.getElementById("txtb ...

  4. JS事件 文本框内容改变事件（onchange）通过改变文本框的内容来触发onchange事件，同时执行被调用的程序。

    文本框内容改变事件(onchange) 通过改变文本框的内容来触发onchange事件,同时执行被调用的程序. 如下代码,当用户将文本框内的文字改变后,弹出对话框"您改变了文本内容!&quo ...

  5. js监听文本框内容变化

    js监听文本框内容变化 原理很简单,就是在外部先声明一个用来记录input值的变量,然后每0.1秒比较这个值与input的值,如果发生改变,则运行自己的代码,同时改变变量.从而实现对input值改变的 ...

  6. css3-13 如何改变文本框的轮廓颜色

    css3-13 如何改变文本框的轮廓颜色 一.总结 一句话总结:outline使用和border很像,几乎一模一样,多了一个offset属性 1.轮廓outline如何使用? 使用和border很像, ...

  7. js 判断一个文本框是否获得焦点

    1.js 判断一个文本框是否获得焦点 // 可以用document.activeElement判断 // document.activeElement表示当前活动的元素   // 查找你要判断的文本框 ...

  8. js正则表达式限制文本框只能输入数字,小数点,英文字母

    1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafter ...

  9. JS 正则表达式 控制文本框只能输入中文、英文、数字与指定特殊符号

    JS 正则表达式 控制文本框只能输入中文.英文.数字与指定特殊符号(屏蔽表情输入) onkeyup:释放键盘事件 onpaste:粘贴事件 oncontextmenu :鼠标右击事件 只能输入中文: ...

随机推荐

  1. 每个配置xml的含义作用

    参考链接 web.xml xxx-servlet.xml(例如:dispatcher-servlet.xml)是Spring MVC里的,控制器,拦截url,转发view,对应的是controller ...

  2. 发布（高程数据）服务，Service Editor界面无LERC格式选项

    [问题描述]: ArcGIS Server 发布(高程数据)服务,无 LERC格式选项,而官方帮助中发布流程提示需要选择LERC格式. [解决办法]: 需求:发布高程数据,ArcGIS Server版 ...

  3. https://github.com/akullpp/awesome-java

    java stack https://github.com/akullpp/awesome-java

  4. 告诉你Hadoop是什么

    Hadoop是什么?Hadoop是一个开发和运行处理大规模数据的软件平台,是Appach的一个用java语言实现开源软件框架,实现在大量计算机组成的集群中对海量数据进行分布式计算. Hadoop框架中 ...

  5. BLE GATT规范中关于UUID与属性的详细解析

    1. 角色 除了GAP定义了角色之外,BLE还定义了另外2种角色:GATT服务器和GATT客户端,它们完全独立于GAP的角色.提供数据的设备称为GATT服务器,访问GATT服务器而获得数据的设备称为G ...

  6. xcode8继续愉快的使用插件

    https://github.com/inket/update_xcode_plugins https://github.com/fpg1503/MakeXcodeGr8Again xcode8增加了 ...

  7. AQS 与 LockSupport

    1.结构 Lock的实现类其实都是构建在AbstractQueuedSynchronizer上,每个Lock实现类都持有自己内部类Sync的实例 二.二元信号量 A semaphore initial ...

  8. cf708B. Recover the String---（构造法）

    题目链接:http://codeforces.com/problemset/problem/708/B 意思是给出四个参数 a00表01串中00对的数量 a01表01串中01对的数量 a10表01串中 ...

  9. 【转】Java魔法堂：String.format详解

    Java魔法堂:String.format详解     目录     一.前言    二.重载方法     三.占位符     四.对字符.字符串进行格式化     五.对整数进行格式化     六. ...

  10. 用NPOI操作EXCEL关于HSSFClientAnchor(dx1,dy1,dx2,dy2,col1,row1,col2,row2)的参数

    2.4.1 用NPOI操作EXCEL关于HSSFClientAnchor(dx1,dy1,dx2,dy2,col1,row1,col2,row2)的参数   NPOI教程:http://www.cnb ...