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表单验证 默认的提示 < ...
随机推荐
- markman & psd
markman & psd MarkMan 设计稿标 & 测量神器 http://www.getmarkman.com/ https://www.jianshu.com/p/83af3 ...
- [BZOJ2462] [BeiJing2011]矩阵模板(二维Hash)
传送门 二维哈希即可. 注意质数选的大一些,不然会超时. 还有插入的时候不判重居然比判重要快.. ——代码 #include <cstdio> int main() { ; ") ...
- hdu 1179最大匹配
#include<stdio.h> #include<string.h> #define N 200 int map[N][N],visit[N],link[N],n,m; i ...
- 调整JVM内存大小
首次运行公司项目,出现了内存溢出,具体出现java.lang.OutOfMemoryError: PermGen space和java.lang.OutOfMemoryError:GC overhea ...
- 记 SpringBoot1.* 转 Springoot2.0 遇到的问题
1.拦截器问题 到2.0之后在配置文件中写 static-path-pattern: /static/** 已经不起作用(2.0需要在方法中配置) SpringBoot1.*写法 @Configura ...
- 苹果装WIN 7
一.准备:1.8G或以上的正版U盘或者移动硬盘,提前备份U盘数据(2013款air要求安装64位系统,市面上比较多U盘不是正版盘,一般做不成功,要换盘) 2.64位纯净版Windows7 ISO的下载 ...
- springboot application.properties
verify if you have this items: @Bean public CommonsMultipartResolver multipartResolver() { CommonsMu ...
- hdu 2544 最短路(SPFA算法)
本题链接:点击打开链接 本题大意: 首先输入一个n,m.代表有n个点.m条边.然后输入m条边,每条边输入两个点及边权.1为起点,n为终点.输入两个零表示结束. 解题思路: 本题能够使用SPFA算法来做 ...
- Android网络爬虫程序(基于Jsoup)
摘要:基于 Jsoup 实现一个 Android 的网络爬虫程序,抓取网页的内容并显示出来.写这个程序的主要目的是抓取海投网的宣讲会信息(公司.时间.地点)并在移动端显示,这样就可以随时随地的浏览在学 ...
- 阿里云CentOS7.3搭建多用户私有git服务器(从安装git开始)
起因 自己会有练手的不敢公开的项目,就自己搭建个服务器放自己的渣代码了. 在经历了连不上服务器.没有访问权限.没法提交以后,我打通了任督二脉. 我这个git服务器适合条件:1.就那么几个人小项目,不是 ...