JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理)


Posted in jQuery onJune 09, 2017

 先上三张效果图:

JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理) 
JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理) 
JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理)

这些功能在Java Web开发中可能是经常需要的,虽然很简单却使很实用的功能,这里记录下以免忘记。

1. 先说表单提交前验证:后台经常用到(这里是提交后统一验证,及时验证请参考我另一篇文章

http://blog.csdn.net/jianzhonghao/article/details/52503431)

1.1 通过submit 按钮提交后 会根据form的属性action=“路径”来跳转到相应的路径,这时,给form添加一个 onsubmit =”return check()” 属性, check()使我们要写的验证函数,如下图:

<form action="路径" onsubmit="return check()" method="POST">

1.2 check()函数如下(验证姓名是否填写 与 单选框性别是否选中) $(‘#notice') 的话,随便写个div加个id属性就好了

<script type="text/javascript"> 
 function check(){
  var name = $('#name').val().trim();
  var gender=$('input:radio[name="gender"]:checked').val();
  if(!name){
   $('#notice').text('客服名称不能为空!').show();
   return false;
  }else if(!gender){
   $('#notice').text('请选择客服性别!').show();
   return false;
  }
  else{
   return true;
  }
 }
</script>
<div id="notice" style="font-size: 30px;color:red;margin-top: 15px;" ></div>

1.3最后说一下删除时,确认是否删除的问题

<input type="image" src="删除图标的路径" title="删除" onclick="{if(confirm('确定删除吗?')){javascript:document:delfrom_${ServerInfo.id };return true;}return false;}">
分开写实际就是
if(confirm('确定删除吗?')){
 {javascript:document:delfrom_${ServerInfo.id };
 return true;
}
 return false;

以上所述是小编给大家介绍的JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
原生Aajax 和jQuery Ajax 写法个人总结
Mar 24 jQuery
jQuery实现简单的滑动导航代码(移动端)
May 22 jQuery
jquery请求servlet实现ajax异步请求的示例
Jun 03 jQuery
使用jQuery实现动态添加小广告
Jul 11 jQuery
基于Jquery Ajax type的4种类型(详解)
Aug 02 jQuery
jQuery实现可兼容IE6的滚动监听功能
Sep 20 jQuery
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 jQuery
jQuery实现判断上传图片类型和大小的方法示例
Apr 11 jQuery
jQuery中元素选择器(element)简单用法示例
May 14 jQuery
深入浅析angular和vue还有jquery的区别
Aug 13 jQuery
jQuery实现当拉动滚动条到底部加载数据的方法分析
Jan 24 jQuery
JQuery属性操作与循环用法示例
May 15 jQuery
JQuery.dataTables表格插件添加跳转到指定页
Jun 09 #jQuery
jQuery为某个div加入行样式
Jun 09 #jQuery
Jquery+Ajax+xml实现中国地区选择三级联动菜单效果(推荐)
Jun 09 #jQuery
jQuery Validate表单验证插件实现代码
Jun 08 #jQuery
jquery Ajax实现Select动态添加数据
Jun 08 #jQuery
jquery实现放大镜简洁代码(推荐)
Jun 08 #jQuery
jQuery+ajax实现局部刷新的两种方法
Jun 08 #jQuery
You might like
解决Codeigniter不能上传rar和zip压缩包问题
2014/03/07 PHP
PHP使用递归按层级查找数据的方法
2019/11/10 PHP
PHP的重载使用魔术方法代码实例详解
2021/02/26 PHP
JavaScript 内置对象属性及方法集合
2010/07/04 Javascript
使用jquery实现以post打开新窗口
2014/03/19 Javascript
javascript使用数组的push方法完成快速排序
2014/09/15 Javascript
javascript实现滑动解锁功能
2014/12/31 Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
2015/04/12 Javascript
解决jQuery uploadify在非IE核心浏览器下无法上传
2015/08/05 Javascript
jQuery实现图片轮播特效代码分享
2015/09/15 Javascript
深入浅析同源策略和跨域访问
2015/11/26 Javascript
Bootstrap和Angularjs配合自制弹框的实例代码
2016/08/24 Javascript
jQuery内容筛选选择器实例代码
2017/02/06 Javascript
nodejs中使用HTTP分块响应和定时器示例代码
2017/03/19 NodeJs
Angular4表单验证代码详解
2017/09/03 Javascript
解决Jstree 选中父节点时被禁用的子节点也会选中的问题
2017/12/27 Javascript
浅析vue深复制
2018/01/29 Javascript
Vue表单类的父子组件数据传递示例
2018/05/03 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
2019/05/27 Javascript
微信小程序wx.navigateTo中events属性实现页面间通信传值,数据同步
2019/07/13 Javascript
layui加载表格,绑定新增,编辑删除,查看按钮事件的例子
2019/09/06 Javascript
layui前端时间戳转化实例
2019/11/15 Javascript
python中二维阵列的变换实例
2014/10/09 Python
python解决网站的反爬虫策略总结
2016/10/26 Python
解决pycharm运行出错,代码正确结果不显示的问题
2018/11/30 Python
基于python的列表list和集合set操作
2019/11/24 Python
Python基础之函数基本用法与进阶详解
2020/01/02 Python
浅谈pytorch池化maxpool2D注意事项
2020/02/18 Python
Python实现电视里的5毛特效实例代码详解
2020/05/15 Python
一道SQL存储过程面试题
2016/10/07 面试题
大学生志愿者感言
2014/01/15 职场文书
2014党委书记四风问题对照检查材料思想汇报
2014/09/22 职场文书
公司停电通知
2015/04/15 职场文书
2015年学生资助工作总结
2015/05/25 职场文书
尊师重教主题班会
2015/08/14 职场文书
Python实现归一化算法详情
2022/03/18 Python