jquery获取和失去焦点改变样式
第一种:(文本框获取焦点后,它的颜色会有所变化,当失去焦点的时候,恢复为原来的样子)
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="jquery-1.11.3.js"></script>
<style type="text/css">
input:focus ,textarea:focus{
border: 1px solid #f00;
background: #fcc;
}
</style> <body>
<form action="#" method="POST" id="regForm">
<fieldset>
<legend>个人基本信息</legend>
<div>
<label for="username">名称:</label>
<input id="username" type="text">
</div>
<div>
<label for="pass">密码:</label>
<input id="pass" type="password">
</div>
<div>
<label for="msg">详细信息:</label>
<textarea id="msg"></textarea>
</div> </fieldset>
</form> </body>
</html>
只不过IE中不兼容
第二种IE兼容:
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="jquery-1.11.3.js"></script>
<style type="text/css"> .focus{
border: 1px solid #f00;
background: #fcc;
}
</style>
<script type="text/javascript">
$(function(){
$(":input").focus(function(){
$(this).addClass("focus")
}).blur(function(){
$(this).removeClass("focus");
})
}) </script>
<body>
<form action="#" method="POST" id="regForm">
<fieldset>
<legend>个人基本信息</legend>
<div>
<label for="username">名称:</label>
<input id="username" type="text">
</div>
<div>
<label for="pass">密码:</label>
<input id="pass" type="password">
</div>
<div>
<label for="msg">详细信息:</label>
<textarea id="msg"></textarea>
</div> </fieldset>
</form> </body>
</html>
jquery获取和失去焦点改变样式的更多相关文章
- javascript和jquery 移除事件 和 改变样式
javascript移除事件: document.getElementById("word").onmouseover = null; javascript改变样式: docume ...
- 问题:关于坛友一个获取text内容并改变样式的实现
需求:点击button获得input框中选中的内容,让选中的内容变红, 实现:代码如下 1: <!DOCTYPE HTML> 3: <head> "content-t ...
- jQuery实现单击某个标签改变样式
1.HTML代码,如下图: <p class="sc_member_recharge_form"> <span class="selected" ...
- jquery获取焦点和失去焦点事件代码
input失去焦点和获得焦点 鼠标在搜索框中点击的时候里面的文字就消失了. 我们在做网站的时候经常会用到搜索框的获得焦点和失去焦点的事件,因为懒,每次都去写非常的烦,于是就一劳永逸,遇到类似情况就来调 ...
- js/jquery获取文本框的值与改变文本框的值
我们就用它来学习获取文本框的值及改变文本框的值. 代码如下 复制代码 <script>function get1(){ document.getElementById("txtb ...
- jquery的blur之后,focus获取不到焦点的解决办法
一:很多童鞋可能会遇到这种情况: jquery的blur之后,focus获取不到焦点. 二:使用场景: 用户填写信息的时候,若邮箱为空,则提示 请填写邮箱,并将光标置于填写邮箱的文本框里,方便用户的再 ...
- jQuery获取CSS样式中的颜色值的问题
转自:http://blog.csdn.net/cwj649956781/article/details/23261529 jQuery获取CSS样式中的颜色值的问题,不同浏览器格式不同的解决办法,需 ...
- jQuery的input 失去焦点之后,不能再获取到焦点
今天写了一个字段唯一性校验功能,验证设备仪器编号唯一,当输入编号之后 ,点击其他,失去焦点后,后台验证唯一,有过此编号,就给出提示,重新填写. 当使用ie时候,获取焦点正常 ,但是使用火狐就获取不到焦 ...
- jQuery入门(2)使用jQuery操作元素的属性与样式
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
随机推荐
- Centos升级gcc4.4.7升级gcc4.8手记
本博客来自:http://www.mudbest.com/centos%E5%8D%87%E7%BA%A7gcc4-4-7%E5%8D%87%E7%BA%A7gcc4-8%E6%89%8B%E8%AE ...
- zoj1076 Gene Assembly
这道和zoj1025一样,本质是贪心算法,首先要求任意最长的序列,我们只要保证最长就行,也就是在一幅图中找一个最长的链,首先我们需要根据y排序(输入为x,y),因为y大的肯定在y小的后面,然后就直接贪 ...
- phpstorm 设置多项目并存
phpstorm 或 webstorm 设置多个项目可以并存: File -> settings -> Directories -> Add Content Root 中添加你当前的 ...
- Android 模块化编程之引用本地的aar
转: http://www.stormzhang.com/android/2015/03/01/android-reference-local-aar/ 随着项目越来越多,代码的复用就变得异常重要,这 ...
- jquery 实现横向滑动自动切换源码(同时显示多张图片)
html代码: <!doctype html> <html lang="en"> <head> <meta charset="U ...
- Weex 开发入门
去年也听说过 React Native 技术,现在好像很多大公司都在这套技术中踩坑,在开发自己的UI.工作中涉及不到,一直没有学习相关的知识. 并且听说阿里的 vue native,一直很期待.前段时 ...
- Hot-Bar 軟板設計注意事項
Hot-Bar reflow (熔錫熱壓焊接),其最只要功能,就是利用熱壓頭熔融已經印刷於電子印刷電路(PCB)上的錫膏,藉以連接兩個各自獨立的電子零件,最常見到的是將軟排線(FPB)焊接於電子印刷電 ...
- docker 创建镜像
docker:/root# docker search centos NAME DESCRIPTION STARS OFFICIAL AUTOMATED centos The official bui ...
- string 到 wstring的转换
string 到 wstring的转换_一景_新浪博客 string 到 wstring的转换 (2009-08-10 20:52:34) 转载▼ 标签: 杂谈 ...
- hdu 5586 Sum(dp+技巧)
Problem Description There )mod10007.After that,the sum of n numbers should be as much as possible.Wh ...