题目::创建若干个输入文本框,当光标离开文本框的时候如果文本框为空,则将文本框背景色设置为红色,如果不为空则为白色。

 <!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>无标题文档</title>
<!--创建若干个输入文本框,当光标离开文本框的时候如果文本框为空,则将文本框背景色设置为红色,如果不为空则为白色-->
<script src="jquery-1.11.2.min.js"></script>
</head>
<body>
<input type="text" value="第一个" style="background-color:#C00"/>
<input type="text" value="第二个" style="background-color:#C00"/>
<input type="text" value="第三个" style="background-color:#C00"/>
<input type="text" value="第四个" style="background-color:#C00"/> </body>
</html> <script type="text/javascript"> $(document).ready(function(e) {
$("input").blur(function(e){
if($(this).val() == ""){
$(this).css("background-color","#F00");
}else{
$(this).css("background-color","#FFF");
}
}); }); </script>

显示的结果::

PHP----练习----光标离开文本框时变色的更多相关文章

  1. [原]创建三个输入文本框,当光标离开文本框的时候如果文本框为空,则将文本框背景色设置为红色,如果不为空则为白色。提示:焦点进入控件的事件是onfocus,焦点离开控件的事件是onblur

    window.onload = function () {             var txts = document.getElementsByTagName('input');         ...

  2. 使用 elementUI 的表单进行查询,表单中只有一个文本框时,回车会自动触发表单的提交事件,导致页面的刷新。

    使用elementUI的el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面: 原因:由于当表单只有一个文本框时,按下回车将会触发表单的提交事件, 从而导致页面刷新. ...

  3. JQ 让光标在文本框最末尾

    function setFocus() { //文本末尾获得焦点 var obj = event.srcElement; var txt = obj.createTextRange(); txt.mo ...

  4. [JS] 鼠标点击文本框清空默认值,离开文本框恢复默认值

    在使用文本框的时候,若设定了初始值,选择文本框进行输入的时候要将本来的内容进行删除,会显得非常麻烦 可以在文本框属性定义触发onfocus和onblur两个事件时对应的js功能 下面以asp.net代 ...

  5. 禁止backspace键(退格键),但输入文本框时不禁止(兼容IE)

    Ext实现方式: Ext.getDoc().on('keydown',function(e){      if(e.getKey() == 8 && e.getTarget().typ ...

  6. Jquery / js 判断数据类型方法(限制文本框类型输入)

    当想要判断文本框中的值是否为自己想要的类型时,可以通过一些方法作出判断,这里对于光标离开文本框时判断文本框中输入的是否是数值类型,如果不是,做出提示 $("#WORKYEARS") ...

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

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

  8. winform中文本框的一些案例

    项目中经常看到在输入金额时,会加逗号,最近在复习正则表达式,就联系下,界面如下:

  9. Jquery文本框小例(必填框)

    <script src="../JavaScript/jquery-2.0.2.min.js"></script> <script type=&quo ...

随机推荐

  1. Linux下模拟多线程的并发并发shell脚本

    分享一个在Linux下模拟多线程的并发脚本,使用这个脚本可以同时批量在定义数量的服务器上执行相关命令,比起普通for/while循环只能顺序一条一条执行的效率高非常多,在管理大批服务器时非常的实用.  ...

  2. [转]象棋AI算法(一)

    本文转自:http://blog.csdn.net/u012723995/article/details/47133693 参考文献:http://www.xqbase.com/computer/se ...

  3. C#基础 (一)

    值类型和引用类型 堆和栈 栈存放的数据: (1)某些类型变量的值(2)程序当前的执行环境(3)传递给方法的参数 堆是存放对象的地方 对象类型有两种: 值类型和引用类型,他们的存储方式不同值类型: 只需 ...

  4. php发送邮件功能(PHPMailer-master插件)

    当作一个插件使用即可,放到网站根目录,然后调用里面的mail.php 源码

  5. 前端(三):JavaScript基础

    JavaScript是一种属于网络的脚本语言,常用来为网页添加各式各样的动态功能,是一种动态类型.弱类型.基于原型的语言.它包括三个部分:ECMAScript.BOM和DOM.ECMAScript描述 ...

  6. apache和tomcat搭建集群

    最近在学习简单的apache服务器和两个tomcat一起搭建集群,这里简单记录一下 1.准备工作 ①搭建一个可以运行的web项目 用maven搭建springmvc项目 ,只要将这里面的web.xml ...

  7. spring cglib 与 jdk 动态代理

    1. 概述 JDK动态代理是利用java反射机制 生成一个实现接口的匿名类, 在调用具体方法前调用InvocationHandler来处理 Cglib动态代理是 利用asm开源包 把被代理类的clas ...

  8. javascript刷新页面的集中办法

    1. history.go(0) 2. location.reload() 3. location=location 4. location.assign(location) 5. document. ...

  9. iview table数据排序不正确

    在使用iview的table组件时,要做排序 代码: sortable: true,sortMethod: (a, b, type) => { if (type === 'desc') { re ...

  10. VMWARE错误-"VirtualInfrastructure.Utils.ClientsXml"的类型初始值设定项引发异常

    异常信息:"VirtualInfrastructure.Utils.ClientsXml"的类型初始值设定项引发异常. 解决方案:以管理员的身份运行客户程序