jQuery——表单应用（1）
实现结果：聚焦表单的input部分时，input格式变更为CSS样式（获取和失去焦点改变样式）
HTML：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link type="text/css" href="01.css" rel="stylesheet"/>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<form action="#" method="post" id="regForm">
<fieldset>
<legend>个人基本信息</legend>
<div>
<label for="username">名称：</label>
<input id="username" type="text"/>
</div>
<div>
<label for="password">密码：</label>
<input id="password" type="password"/>
</div>
<div>
<label for="msg">详细信息：</label>
<textarea id="msg"></textarea>
</div>
</fieldset>
</form>
<script type="text/javascript">
$(function(){
$("input").focus(function(){
$(this).addClass("focus");
}).blur(function(){
$(this).removeClass("focus");
})
})
</script>
</body>
</html>
CSS：
.focus{
border: 1px solid red;
background: red;
}
jQuery——表单应用（1）的更多相关文章
- Jquery表单提交后获取返回Json值
1.给form添加id值: <form action="/News/SaveMessage" method="post" accept-charset=& ...
- Jquery表单序列化和AJAX全局事件
Jquery表单序列化 1.必须放在form标签内: 2.控件必须有name属性: 3.控件的value值会提交到服务器: 如: <form id="form1"> & ...
- 【jquery】Validform，一款不错的 jquery 表单验证插件
关于 Validform 这是一款很不错的 jquery 表单验证插件,它几乎能够满足任何验证需求,仅仅一行代码就能搞定整站的表单验证. $('form').Validform(); 为什么能如此方便 ...
- 【jQuery基础学习】06 jQuery表单验证插件-Validation
jQuery的基础部分前面都讲完了,那么就看插件了. 关于jQuery表单验证插件-Validation validation特点: 内置验证规则:拥有必填.数字.E-Mail.URL和信用卡号码等1 ...
- python_way day17 jQuery表单验证，事件绑定，插件，文本框架，正则表达式
python_way day17 1.jQuery表单验证 dom事件绑定 jquery事件绑定 $.each return值的判断 jquery扩展方法 2.前段插件 3.jDango文本框架 4. ...
- jquery表单验证使用插件formValidator
JQuery表单验证使用插件formValidator 作者: 字体:[增加 减小] 类型:转载 时间:2012-11-10我要评论 jquery表单验证使用插件formValidator,可供有需求 ...
- jQuery打造用户注册时获取焦点文本框出现提示jquery表单特效
jQuery打造用户注册时获取焦点文本框出现提示效果的jquery表单特效 当获取焦点时,会分别的弹出相应的信息提示框,失去焦点就会隐藏提示信息. 效果兼容性很高,适用浏览器:IE6.IE7.IE8. ...
- jQuery 表单验证插件 jQuery Validation Engine 使用
jQuery 表单验证插件 jQuery Validation Engine 使用方式如下: 1.引入头文件(注意一定要把jQuery放在前面),指定使用 jQuery Validation Engi ...
- jQuery表单验证以及将表单序列化为json对象小练习
jquery表单验证(非实时验证),同时,将表单序列化为json对象提交表单. <!DOCTYPE html> <html lang="en"> <h ...
- JQuery 表单验证--jquery validation
jquery validation,表单验证控件 官方地址 :http://jqueryvalidation.org/ jquery表单验证 默认值校验规则 jquery表单验证 默认的提示 < ...
随机推荐
- JS基础：正则表达式
简介 正则表达式 (regular expression) 描述了一种字符串匹配的模式,可以用来检查一个字符串是否含有某种子串.将匹配的子串做替换或者从某个字符串中取出符合某个条件的子串等.在 JS ...
- 使用Spring-Session共享使用Session
前言: session共享策略有很多,常见的有粘性复制,高并发下效率查.tomcat-redis-session-manager无疑是一个挺好的方案,缺点要配置tomcat,有点复杂.最优的方案莫过于 ...
- ajax异步获取数据后动态向表格中添加数据(行)
因为某些原因,项目中突然需要做自己做个ajax异步获取数据后动态向表格中添加数据的页面,网上找了半天都没有 看到现成的,决定自己写个例子 1.HTML页面 <!doctype html> ...
- android开发里跳过的坑-AS导入NDK工程提示错误 No such property: sdkHandler for class: com.android.build.gradle.LibraryPlugin
接到一个NDK工程需要调试,导入后发现总是提示错误 Error:(37, 1) A problem occurred evaluating project ':libuvccamera'.> N ...
- 「CodePlus 2017 12 月赛」火锅盛宴
n<=100000种食物,给每个食物煮熟时间,有q<=500000个操作:在某时刻插入某个食物:查询熟食中编号最小的并删除之:查询是否有编号为id的食物,如果有查询是否有编号为id的熟食, ...
- Servlet实现点击计数器
以下内容引用自http://wiki.jikexueyuan.com/project/servlet/hits-counter.html: 一.Web页面的点击计数器 很多时候,可能有兴趣知道网站的某 ...
- AutoCAD菜单加载失败 找不到文件mnc 怎么办
菜单加载失败,找不到文件 SWFILECONV(mnu/mns/mnc) 找到CAD安装目录下的swfileconv.arx文件,用记事本打开,清空内容,然后保存即可.
- js算法：分治法-循环赛事日程表
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/ ...
- SEO 搜索引擎优化培训01
百度搜索风云榜:http://top.baidu.com/boards 页面上的因素:对搜索引擎而言
- 使用 Code Map 理解复杂代码1 ——Visual Studio2012
第一次知道code map是在Visual Studio Ultimate 2012自带的解说上面,当时认为十分好奇,所以查了查.结果一查就是好几天.原来Visual Studio Ultimate ...