<!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. Java单链表的实现

    将结点Node进行封装,假设Node的操作有增加,删除,查找,打印几个操作.将Node实现为链表Link的内部类,简化代码. package Chapter5; import java.securit ...

  2. spark之combineByKey

    combineByKey def combineByKey[C](createCombiner: (V) => C, mergeValue: (C, V) => C, mergeCombi ...

  3. 最有用的Linux命令行使用技巧集锦

    最近在Quora上看到一个问答题目,关于在高效率Linux用户节省时间Tips.将该题目的回答进行学习总结,加上自己的一些经验,记录如下,方便自己和大家参考. 下面介绍的都是一些命令行工具,这些工具在 ...

  4. 蓝牙的AVDTP协议笔记

    1.概述    AVDTP(AUDIO/VIDEO DISTRIBUTION TRANSPORT PROTOCOL)是用来描述音频/视频在蓝牙设备间的传输的协议,是A2DP协议的基础协议,其在协议栈中 ...

  5. Excel VBA

    =COUNTIF(Y3:Y212,"=11") =SUMIF(Y3:Y212,"=11",AA3:AA212) =SUMPRODUCT((Y3:Y212=&qu ...

  6. 【C】用我所学去讲C语言指针

    很多人不敢讲C的指针,有些人讲不清,有些人怕讲错.初生牛犊不怕虎,就让我讲讲. 下面开始. 一.指针的定义  指针是内存单元的编号.内存单元是以字节为单位的.所以指针就是字节的编号. 比如我们的个人电 ...

  7. hive中关于数据库与表等的基本操作

    一:基本用法 1.新建数据库 2.删除数据库 3.删除非空的数据库 4.指定数据库的位置 LOCATION:指定数据库的位置,不会在系统的默认文件下. 5.在指定数据库中新建表(验证在指定的数据库中可 ...

  8. ViewModel命令ICommand对象定义

    如果定义如下 public ICommand ViewMenuItemCommand: 那么UI绑定,则无法执行代理方法 需如下定义 public ICommand ViewMenuItemComma ...

  9. 图解SSL/TLS协议

    本周,CloudFlare宣布,开始提供Keyless服务,即你把网站放到它们的CDN上,不用提供自己的私钥,也能使用SSL加密链接. 我看了CloudFlare的说明(这里和这里),突然意识到这是绝 ...

  10. 【Algorithm】堆排,C++实现

    对一个数组中的元素按照顺序构建二叉树,就形成了一个(二叉)堆.(二叉树是虚拟的,并不是真的建立二叉树) 表示堆的数组A有两个重要属性:A.heapSize,表示堆里面有多少元素,数组里有多少元素在堆里 ...