<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form action="{$actionUrl}fuyuandian/index.html" method="post" id="form">
<p class="fi_top">填写信息预约</p>
<ul class="fill_ui">
<li>
<div class="l">缘主姓名</div>
<div class="r"><input type="text" name="name" placeholder="请输入您的姓名" id="username"/></div>
</li>
<li>
<div class="l">联系电话</div>
<div class="r"><input type="text" name="phonenumber" placeholder="请输入电话号码" id="phone"/></div>
</li>
<li>
<div class="l">开光需求</div>
<div class="r"><textarea name="kaiguangxuqiu" placeholder="请输入您的开光需求" id="txtarea"></textarea></div>
</li>
</ul>
<input type="button" value="确认预约" class="fi_btn" id="formBtn"/>
<input type="hidden" name="form_id" value="7">
</form>
<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

$(function () {
$("#formBtn").click(function () {
var regName =/^[\u4e00-\u9fa5]{2,4}$/;
var regPhone=/^1[0-9]{10}$/;
var xm =$('#username').val();
var phone =$('#phone').val();
var txtarea =$('#txtarea').val();
if(xm==''){
alert('请输入姓名');
return false;
}
if(!regName.test(xm)){
alert('请输入汉字');
return false;
}
if (phone=='') {
alert('请输入手机号码');
return false;
}
if(!regPhone.test(phone)){
alert('请输入正确的手机号码');
return false;
}
if (txtarea=='') {
alert('请输入开光需求')
return false;
}
var postUrl = $("#form").attr('action');
$.ajax({
url: postUrl,
data: $("#form").serialize(),
type: 'post',
dataType: 'json',
beforeSend: function () {
// 禁用按钮防止重复提交
$("#formBtn").attr({ disabled: "disabled" });
$("#formBtn").val('正在提交中...')
},
success: function (res) {
if (res.code == '1') {
alert('您已预约成功，请保持电话畅通');
$("#formBtn").val('已成功提交')
} else {
alert(res.msg);
$("#formBtn").removeAttr("disabled");
}
}
});
});
});
</script>
</body>
</html>

ajax 禁用按钮防止重复提交的更多相关文章

  1. asp.net 禁用按钮防止重复提交

    按钮设置 1.OnClientClick属性为”this.disabled=true;“ 2.UseSubmitBehavior属性为”false“ 举例如下: <asp:Button ID=& ...

  2. A标签/按钮防止重复提交&页面Loading制作

    [实现原理] 防止重复提交与页面的提交时的Loading设置,均是在提交,但是尚未处理完成进行的操作,且提交为异步提交(同步提交不需要考虑).因此,其实现原理是在点击按钮或A标签时,将按钮/A标签置为 ...

  3. 关于Asp.Net中避免用户连续多次点击按钮，重复提交表单的处理

    Web页面中经常碰到这类问题,就是客户端多次点击一个按钮或者链接,导致程序出现不可预知的麻烦. 客户就是上帝,他们也不是有意要给你的系统造成破坏,这么做的原因很大一部分是因为网络慢,点击一个操作之后, ...

  4. 防止按钮button重复提交，点击后失效，10秒后恢复

    <script type="text/javascript"> $(function () {//页面完全加载完后执行 /*防止重复提交 10秒后恢复*/ var is ...

  5. js按钮 防重复提交

    给html 按钮加id属性   例: <button id="addBtn"  onclinck="check()">  </button&g ...

  6. Ajax beforeSend和complete 方法与防止重复提交

    $.ajax({ beforeSend: function(){ // Handle the beforeSend event }, complete: function(){ // Handle t ...

  7. jQuery的$ .ajax防止重复提交的方法

    没啥说的直接贴代码,很简单: 第一种方式:的onclick点击事件类型 <SCRIPT> function member_del(obj,id){ var lock = false; // ...

  8. js禁止重复提交方法

    beforeSend: function () { // 禁用按钮防止重复提交 $("#fileForm a[class='btn blue_btn']").removeAttr( ...

  9. java web解决表单重复提交问题

    我们大家再进行web开发的时候,必不可少会遇见表单重复提交问题.今天就来给总结如何解决表单提交问题,欢迎大家交流指正. 首先我们在讨论如何解决表单重复提交问题之前先来解决三个问题:1.什么叫表单重复提 ...

随机推荐

  1. bootstrap-table方法之：expandRow-collapseRow，展开或关闭当前行数据

    官方演示地址:http://issues.wenzhixin.net.cn/bootstrap-table/methods/expandRow-collapseRow.html <!DOCTYP ...

  2. 22、Cocos2dx 3.0游戏开发找小三之音乐与音效：假如世界上没有了音乐，你的耳朵会孤单吗？

    重开发人员的劳动成果,转载的时候请务必注明出处:http://blog.csdn.net/haomengzhu/article/details/30485103 假如世界上没有了音乐,在森林里.我们听 ...

  3. ACdream区域赛指导赛之手速赛系列(7)

    A -Dragon Maze Time Limit: 2000/1000MS (Java/Others)Memory Limit: 128000/64000KB (Java/Others) Submi ...

  4. 重写description方法

    //重写description方法 //description建议大家在实际开发中都要重写这种方法.然后将类中有意义的成员变量打印出来,这样很方便我们调试程序 -(NSString *)descrip ...

  5. 从es中提取全量数据的shell脚本

    [root@hadoop3 xiaole_chk_url]# sh looh.es.res.sh 100 200 1 % Total % Received % Xferd Average Speed ...

  6. 解决：sql2005 安装完后 没有服务的问题

    去下面网站下载SQLEXPR_CHS.EXE然后安装就ok了.http://www.microsoft.com/downloadS/details.aspx?familyid=220549B5-0B0 ...

  7. go语言笔记——map map 默认是无序的，不管是按照 key 还是按照 value 默认都不排序

    示例 8.1 make_maps.go package main import "fmt" func main() { var mapLit map[string]int //va ...

  8. 怎么让frameset出现整体滚动条

    a.html<!DOCTYPE html> <html> <head> <title></title> </head> < ...

  9. Systick 更新

    之前写的systick_config(loadvalue) 根据系统时钟为72Mhz来写的,如果system clock不是72MHz怎么办? 重新写了一下,先获取,系统时钟频率. //参数为ms v ...

  10. vue单页面应用刷新网页后vuex的state数据丢失问题以及beforeunload的兼容性

    最近在用vue写h5项目,当使用window.location重定向页面或者刷新当前页面时, 发现当刷新网页后,保存在vuex实例store里的数据会丢失. 后来在网上查找大神的解决方案如下: exp ...