效果如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
fieldset{width: 500px;}
.error{color:red;}
#info{color:#008000;font-weight:bold;}
</style>
<script type="text/javascript" src="../../js/jquery.js"></script>
<script type="text/javascript">
$(function(){
$('#check').click(validate); function validate(){
var dataValid=true;
$('#info').html('');
$('.required').each(function(){
var cur=$(this);
cur.next('span').remove();
if($.trim(cur.val())==''){
cur.after('<span class="error">Mandatory field</span>') ;
dataValid=false;
}
});
if(dataValid){
$('#info').html('Validation OK!');
}
}
});
</script>
</head>
<body>
<form>
<fieldset>
<legend><strong>Personal</strong></legend>
<table>
<tbody>
<tr>
<td>Name:*</td>
<td><input type="text" class="required"/></td>
</tr>
<tr>
<td>Address:*</td>
<td><input type="text" class="required"/></td>
</tr>
</tbody>
</table>
</fieldset>
<br/>
<span id="info"></span>
<br/>
<input type="button" value="Check" id="check"/>
</form>
</body>
</html>

最新文章

  1. AMD and CMD are dead之KMDjs内核之依赖分析
  2. 大三上 —— IOS五天实训
  3. springmvc--json--返回json的日期格式问题
  4. linux下神奇的script命令
  5. Party
  6. Scala-数组
  7. linux 配置 mail server
  8. idea live template
  9. kubernetes集群应用部署实例
  10. Learning to Promote Saliency Detectors
  11. Pandas的可视化操作(利用pandas得到图表)
  12. H5相关网址
  13. 数学用语中的 透明 transitive property
  14. linux搭建DHCP
  15. java 后台 post请求 携带参数 远程操作 调用接口
  16. C# 程序设置开机启动(一)
  17. UVA 10733 - The Colored Cubes(Ploya)
  18. 7.Reverse Integer (INT; Overflow)
  19. ubuntu安装ntp时间服务器
  20. 淘海外分发Job 多线程demo

热门文章

  1. 利用http实现文件的上传和下载
  2. C# 创建Excel并写入内容
  3. POJ3581---Sequence 后缀树组
  4. HDU-3787(字符串模拟)
  5. [置顶] 【Git入门之十一】标签管理
  6. java基础知识(二)
  7. Java_XML操作
  8. 博客换了,比较少用这个博客(http://loid.cf)
  9. 11636 - Hello World! (贪心法)
  10. HDU 2435 There is a war (网络流-最小割)