jQuery文本框得到与失去焦点动态改变样式效果

本文实例讲述了jQuery文本框得到与失去焦点动态改变样式效果。分享给大家供大家参考，具体如下：

html health eta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8 '/title/title style type=' text/CSS ' body { font : normal 12px/17px Arial；} div { padding: 2px }输入，text area { width : 12 emborder : 1px固体# 888;}.焦点{ border: 1px固体# f00背景技术# fcc}/style脚本类型=' text/JavaScript ' src=' http : jquery-1。7 .2 .量滴js '/script脚本类型=' text/JavaScript ' $(function(){ $(' : input ')).focus(function(){ $(this))。addCLaSS(' focus ')；}).模糊(函数(){ $(此)).removeClass(“”焦点');});})/script/head dyform action=' method=' post ' id=' regForm '字段集图例个人基本信息=用户名的/图例分区标签名称：/标签输入id='用户名'类型=' text '/div标签为=“通过”密码：/标签输入id='pass '类型='密码'/div/div标签为='msg '详细信息：/标签文本区域id=' msg ' rows=' 2 ' cols=' 20 '/文本区域/div/字段集/表单/正文/html运行效果图如下：

更多关于jQuery相关内容感兴趣的读者可查看本站专题： 《jQuery扩展技巧总结》 、 《jQuery常用插件及用法总结》 、 《jQuery拖拽特效与技巧总结》 、 《jQuery表格(table)操作技巧汇总》 、 《jquery中Ajax用法总结》 、 《jQuery常见经典特效汇总》 、 《jQuery动画与特效用法总结》 及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。