jQuery(3)--实现注册表单中当用户名为空时,实现输入框边框变色

来源:互联网 发布:巴赫拉米世锦赛数据 编辑:程序博客网 时间:2024/05/22 13:46

效果图如下:

 

源码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>demo05.html</title><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="this is my page"><meta http-equiv="content-type" content="text/html; charset=UTF-8"><!--<link rel="stylesheet" type="text/css" href="./styles.css">--><script type="text/javascript" src="../js/jquery-1.9.1.js"></script><script type="text/javascript">$(document).ready(function() {   //:input 获取的是 type=text,radio,button等select textarea等元素对象$(":input").blur(function() { //注册blur的事件$(this).each(function() { //遍历input元素对象 if ("" == $(this).val()) { //判断元素对象的value值$(this).addClass("blur"); //添加css样式}else{    $(this).removeClass("blur");}});});});</script><style type="text/css">.blur {border: 1px solid red;}</style></head><body><form action="">用户名:<input type="text" name="uname" /><br />密码:<input type="password" name="uname" /><br />邮箱:<input type="text" name="uname" /><br />个人介绍:<textarea rows="10" cols="30"></textarea></form></body></html>