JS练习 改变文本框状态
<!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练习 改变文本框状态的更多相关文章
- 用JS实现改变文本框的只读属性
<input id="aaa" readonly><input id="bbb" readonly> <script>doc ...
- 怎么用js代码改变单选框的选中状态
今天突然有一个需求要用到,使用js代码改变单选框的选中状态.当时想也不想直接 function doGender(gender) { if (gender == "男") { ge ...
- js/jquery获取文本框的值与改变文本框的值
我们就用它来学习获取文本框的值及改变文本框的值. 代码如下 复制代码 <script>function get1(){ document.getElementById("txtb ...
- JS事件 文本框内容改变事件(onchange)通过改变文本框的内容来触发onchange事件,同时执行被调用的程序。
文本框内容改变事件(onchange) 通过改变文本框的内容来触发onchange事件,同时执行被调用的程序. 如下代码,当用户将文本框内的文字改变后,弹出对话框"您改变了文本内容!&quo ...
- js监听文本框内容变化
js监听文本框内容变化 原理很简单,就是在外部先声明一个用来记录input值的变量,然后每0.1秒比较这个值与input的值,如果发生改变,则运行自己的代码,同时改变变量.从而实现对input值改变的 ...
- css3-13 如何改变文本框的轮廓颜色
css3-13 如何改变文本框的轮廓颜色 一.总结 一句话总结:outline使用和border很像,几乎一模一样,多了一个offset属性 1.轮廓outline如何使用? 使用和border很像, ...
- js 判断一个文本框是否获得焦点
1.js 判断一个文本框是否获得焦点 // 可以用document.activeElement判断 // document.activeElement表示当前活动的元素 // 查找你要判断的文本框 ...
- js正则表达式限制文本框只能输入数字,小数点,英文字母
1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafter ...
- JS 正则表达式 控制文本框只能输入中文、英文、数字与指定特殊符号
JS 正则表达式 控制文本框只能输入中文.英文.数字与指定特殊符号(屏蔽表情输入) onkeyup:释放键盘事件 onpaste:粘贴事件 oncontextmenu :鼠标右击事件 只能输入中文: ...
随机推荐
- php的异步处理
在PHP Web程序中,发送手机短信.电子邮件.转换视频格式.记录日志.数据挖掘采集等,都是比较耗时的操作. 为了增强用户体验,需要将这些操作转为异步执行 PHP Web程序中的短耗时异步处理 前 ...
- php经典笔试题
五.基础及程序题(建议使用你擅长的语言:C/C++.PHP.Java) 5.写一个排序算法,可以是冒泡排序或者是快速排序,假设待排序对象是一个维数组.(提示:不能使用系统已有函数,另外请仔细回忆以前学 ...
- [daily][optimize] 一个小python程序的性能优化 (python类型转换函数引申的性能优化)
前天,20161012,到望京面试.第四个职位,终于进了二面.好么,结果人力安排完了面试时间竟然没有通知我,也没有收到短信邀请.如果没有短信邀请门口的保安大哥是不让我进去大厦的.然后,我在11号接到了 ...
- Jquery调用webService的四种方法
1.编写4种WebService方法 [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(Conf ...
- A+Bproblem
package A+Bproblem; /* * A+B Problem 时间限制:3000 ms | 内存限制:65535 KB 难度:0 描述 此题为练手用题,请大家计算一下a+b的值 输入 ...
- 编写SqlHelper使用,在将ExecuteReader方法封装进而读取数据库中的数据时会产生Additional information: 阅读器关闭时尝试调用 Read 无效问题,解决方法与解释
在自学杨中科老师的视频教学时,拓展编写SqlHelper使用,在将ExecuteReader方法封装进而读取数据库中的数据时 会产生Additional information: 阅读器关闭时尝试调用 ...
- EGO Refresh小总结
这几天项目做完,有点闲,正好可以用来做做总结. 忘了是哪位博客大牛说:不能因为知识点小.少而不做总结. 那么现在就开始实践一把吧~ 总的来说,EGO有几点需要设置,设置完之后,就能够自如地用了. 1. ...
- 包含Blob字段的表无法Export/Import
最近一直用MySQL-Front的导出导出工具完成数据库的备份,确实比较方便快捷. 后来增加了一张表,其中有blob字段,上传几个文件后,发现导出不好用了,进度条长期处于停滞状态. 想想也是,要把bl ...
- offset/client/scroll一些总结
offset/client/scroll一些总结 1.offset 首先offset共有五个值 1.offsetParent 2.offsetTop 3.offsetLeft 4.offsetWidt ...
- javascript知识点记录(1)
javascript一些知识点记录 1.substring,slice,substr的用法 substring 和slice 都有startIndex 和 endIndex(不包括endInex),区 ...