按钮的Ajax请求时一次点击两次提交的解决方法
页面中的按钮的type是submit的: <input type="submit" value="Create" id="submit" />
ajax的请求,在JQuery中是:
$(function () { $('#submit').click(function () { var createGenreForm = $('#createGenreForm'); if (createGenreForm.valid()) { var obj = { Name: $('#Name').val(), Description: $('#Description').val() }; var jsonSerialized = JSON.stringify(obj); $.ajax({ type: "POST", url: createGenreForm.attr('action'), dataType: "json", contentType: "application/json; charset=utf-8", data: jsonSerialized, success: function (result) { alert(result.Message); }, error: function (error) { alert("There was an error posting the data to the server: " + error.responseText); } }); } }); });
发生两次提交的原因是在执行完ajax请求后,并没有阻止submit的行为,所以解决方法有两种:
1、不使用type为submit类型的按钮,而是使用type是button的按钮。
2、在$('#submit').click函数中,最后加一行return false;,即可阻止submit。
一点说明:为什么在标题中要嵌入英文?原因是为了能够让国外的网友能查询到这篇文章。平常在Google上查资料的时候,经常参考国外网友的博客,帮助我解决了很多问题,所以我也想让他们能够参考我写的内容。当然文中我不可能全部译为英文,所以我尽量把代码粘全,靠代码说话吧。
以上所述是小编给大家介绍的按钮的Ajax请求时一次点击两次提交的解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
相关推荐
-
AJAX避免用户重复提交请求实现方案
在使用AJAX(jQuery)异步请求数据时,为了避免因某些原因用户同时多次点击按钮,提交重复的请求,我们需要禁用请求提交按钮. 重点:jQuery的 attr 和 removeAttr 两个函数,主要是元素button的disabled属性. Demo: 复制代码 代码如下: <body> <a class="disabled">Button disabeld</a> <a class="abled">Butt
-
Ajax异步(请求)提交类 支持跨域
复制代码 代码如下: /**//* 异步请求类 作者:吾非无心 创建时间:2009.2 --------------------------------------------------------------------------------------------------------------------------------- 修改记录: 2009.4.27--添加 URL 检测功能,如果是"http://xxxx.xxx.xx.xx/.."这样的格式,使用系统提供的
-
JS Ajax请求如何防止重复提交
好长时间没写js代码了刚好遇到这样的问题.我们系统多数表单没有做防止重复提交的. 由于不想在后端这边处理,因为假如由后端处理的话,就需要在页面加载的时候给出一次性的token值,加大了开发的工作量不说,还容易忘记做这个,同时,ajax也不好处理,需要提交失败的话同时返回新的token值. 所以我想在,js这边动手.其实以前和前端提过,久久不见动静,就只好弄块砖丢出去了.思路是,覆盖掉$.ajax,在这里面处理掉防止重复提交的问题,而前端的业务开发不受影响,不改代码,无感知. 我想架构的目的之一,
-
.NET的Ajax请求数据提交实例
本文实例讲述了.NET的Ajax请求数据提交实现方法.分享给大家供大家参考.具体如下: 复制代码 代码如下: <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %> <head runat="server"> <title>ajax请求</title> <link type
-
按钮的Ajax请求时一次点击两次提交的解决方法
页面中的按钮的type是submit的: <input type="submit" value="Create" id="submit" /> ajax的请求,在JQuery中是: $(function () { $('#submit').click(function () { var createGenreForm = $('#createGenreForm'); if (createGenreForm.valid()) { var
-
Ajax请求在数据量大的时候出现超时的解决方法
最近在用EXtjs做项目,在加载数据量特别大的时候会出现加载超时现象,在FB下查看,原来是ext默认ajax请求30秒. 在网上搜到下面的解决方法,以备参考和其他人参考. ExtJS做Ajax请求的时候,默认的相应时间是30秒,如果后来数据查询时间超过30秒,ExtJS就会报错. 这就需要修改ExtJS的超时时间: 2种方法: 1:在Ajax请求的时候加:(timeout: 100000000)属性 复制代码 代码如下: Ext.Ajax.request({ url: 'foo.php', s
-
herf=#导致Ajax请求时没有向后台发送数据
今天在做右键菜单,当点击重命名进行Ajax请求时,并没有向后台发送数据而是直接跳转到了首页.朕百思不得其解,后来在前台页面发现一个问题: 复制代码 代码如下: <span style="font-size:24px;"><li><a href='#' onclick="renameContactsFunction()">重命名</a></li></span> 原来就是这个herf='#'惹的祸.
-
Ajax请求时无法重定向的问题解决代码详解
前言 今天发现,当使用Ajax请求时,如果后台进行重定向到其他页面时是无法成功的,只能在浏览器地址栏输入才能够实现重定向. Ajax默认就是不支持重定向的,它是局部刷新,不重新加载页面. 需要实现的功能是,后台网关拦截请求,看请求中是否存在token.如果不存在就跳转到登录页面.因为大多数请求都是使用Ajax.一开始发现无法进行重定向,每次都是返回到Ajax的结果处理函数.最终的解决办法如下,需要后台和前端进行处理. 后台: /** *功能描述 * @author lgj * @Descript
-
JQuery发送ajax请求时中文乱码问题解决
这篇文章主要介绍了JQuery发送ajax请求时中文乱码问题解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 先排除项目故障: 1.web.xml中是否配置了字符拦截器 <filter> <filter-name>encodingFilter</filter-name> <filter-class>org.springframework.web.filter.CharacterEncodingFilter
-
Android编程中activity启动时出现白屏、黑屏问题的解决方法
本文实例讲述了Android编程中activity启动时出现白屏.黑屏问题的解决方法.分享给大家供大家参考,具体如下: 默认情况下 activity 启动的时候先把屏幕刷成白色,再绘制界面,绘制界面或多或少有点延迟,这段时间中你看到的就是白屏,显然影响用户体验,怎么消除呢? 在 Activity theme 设置style 即可 <style name="AppTheme" parent="android:Theme.Light.NoTitleBar">
-
PHP连接MSSQL时nvarchar字段长度被截断为255的解决方法
本文实例讲述了PHP连接MSSQL时nvarchar字段长度被截断为255的解决方法.分享给大家供大家参考.具体分析如下: PHP 连接 MSSQL 的新手经常遇到这个问题:数据库里面的 nvarchar 字段中数据一切正常,但是用 PHP 查询出来却发现长度只有 255,我们都知道,在 MySQL 里面 varchar 的长度只有 255,但是 MSSQL 却不是,不会是 PHP 将 nvarchar 按照 MySQL 的 varchar 处理了吧. 本文给出了解决方法: 复制代码 代码如下:
-
vue.js 打包时出现空白页和路径错误问题及解决方法
vue-cli输入命令:npm run build 即可打包vue.js的项目 打包出来后项目中就会多了一个文件夹dist,下图为我们打包过后的项目 我们直接运行打包后的文件夹中的index.html文件,会看到网页一片空白,f12调试,全是css,js路径引用错误的问题. 解决:到config文件夹中打开index.js文件. 文件里面有两个assetsPublicPath属性,更改第一个,也就是更改build里面的assetsPublicPath属性: assetsPublicPath属
-
关于layui表单中按钮自动提交的解决方法
layui表单中的按钮会自动提交,这是一个很麻烦的事情. 这几天项目中多次用到表单按钮,仔细研究了下,找到了解决方法: 1.如果不需要放在表单中的按钮,最好不要放在表单中,不在layui的form中的按钮就不会进行自动提交了: 2.放在表单中的按钮可以通过js中的回调函数里添加 return false制止.filter中的参数指的是按钮中的lay-filter属性中的值,这个可以自己随便设. 比如: form.on('submit(filter)',function(data){ ......
-
AJAX的跨域访问-两种有效的解决方法介绍
新的W3C策略实现了HTTP跨域访问,还亏我找了很久的资料解决这个问题:只需要在servlet中返回的头部信息中添加Access-Control-Allow-Origin这个既可.比如我要开放所有我本地的跨域访问,就设置如下:response.setHeader("Access-Control-Allow-Origin", "http://127.0.0.1/*");这样我本地的A工程中的AJAX请求就可以跨域请求B工程中的servlet.代码如下:HTML的JS的
随机推荐
- asp.net使用LINQ to SQL连接数据库及SQL操作语句用法分析
- Thinkphp中的curd应用实用要点
- Linux中用PHP判断程序运行状态的2个方法
- pygame学习笔记(2):画点的三种方法和动画实例
- Android实现数字跳动效果的TextView方法示例
- JS给超链接加确认对话框的方法
- 基于jquery异步传输json数据格式实例代码
- CSDN 博客的代码高亮问题自己修复
- 在校大学生应该看看:《工作了才知道...》
- Shell中获取脚本所在目录绝对路径的方法
- Javascript 陷阱 window全局对象
- javascript实现任务栏消息提示的简单实例
- IE6与IE7中,innerHTML获取param的区别
- 微信小程序 modal详解及实例代码
- Android RecyclerView的卡顿问题的解决方法
- Android 关于ExpandableListView去掉里头分割线的方法
- c#实现识别图片上的验证码数字
- C#遍历删除字符串中重复字符
- Android实现类似于PC中的右键弹出菜单效果
- Ubuntu系统安装使用搜狗输入法的方法(超简单)