众所周知，各种浏览器对于HTML、CSS以及原生JS的支持不尽相同。但是jQuery很好地封装了各种浏览器不同的实现，能够很好地解决跨浏览器的CSS问题。下面就是在review表单操作的时候的一个DEMO，记录在这个地方，方便后面做项目的时候查找使用。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
$("input[type='text']").focus(function(){
$(this).addClass("onfocus");
}).blur(function(){
$(this).removeClass("onfocus");
});
});
</script>
<style type="text/css">
input.onfocus{
border:solid red 2px;
background-color:grey;
}
</style>
</head>
<body>
<form action="#" method="get">
<label for="name">name:</label>
<input type="text" name="name"><br/>
<label for="address">address:</label>
<input type="text" name="address"><br/>
<label for="email">E-mail:</label>
<input type="text" name="email"><br/>
<label for="qq">QQ:</label>
<input type="text" name="qq"><br/>
<input type="button" value="submit"><br/>
</form>
</body>
</html>
jQuery_review之一行语句搞定表单焦点样式,布布扣,bubuko.com
时间： 2024-08-03 19:23:38