Ajax的post表单,不在url后接一大串参数键值对的方法

$(‘#loginForm‘).on(‘submit‘,function (ev) {
        //阻止表单参数附在url后面
        ev.stopPropagation();
        ev.preventDefault();

再在下面写上Ajax方法

即可阻止url后接一大串键值对参数

stopPropagation()方法

该方法将停止事件的传播,阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意,虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用,但是它可以阻止把事件分派到其他节点

preventDefault() 方法

阻止元素发生默认的行为(例如,当点击提交按钮时阻止对表单的提交)

以上,但这样做有一个问题,这样的话,表单的数据将不以formdata的形式传值,而是request payload

而request payload在servlet中是获取不到的

原因:post请求的Content-Type为application/x-www-form-urlencoded,参数是在请求体中,即上面请求中的Form Data。

   而请求的Content-Type为text/plain;charset=UTF-8,而请求表单参数在RequestPayload中

这样的话,有一个解决方案,即为修改请求的Content-Type

在Ajax中可以这样写:

//阻止附在url后面的话,参数不会再formdata中,而是request payload中,故改请求头的类型

            contentType:"application/x-www-form-urlencoded",

如此

即可在servlet中用request.getParameter()方法来获取参数值了

以上是花了蛮多时间,参考他人博客和网上资料得出的解决方法

参考链接如下:

不让url变化的参考:https://segmentfault.com/q/1010000007157022?_ea=1254896

request payload问题的解决参考:https://www.2cto.com/kf/201701/589783.html

Ajax方法参数的详解:https://www.cnblogs.com/tylerdonet/p/3520862.html

原文地址:https://www.cnblogs.com/ihaokun/p/9795128.html

时间: 2024-10-12 02:22:45

Ajax的post表单,不在url后接一大串参数键值对的方法的相关文章

使用ajax提交form表单,包括ajax文件上传

前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },"json"); 又或者是这样的ajax $.ajax({ url:"${pageContext.request.contextPath}/public/testupload", type:"post", data:{username:username}, success:function(data){ w

jquery ajax提交整个表单参数

转自 : http://www.jb51.net/article/35085.htm function submit(){ var formData=$("form").serialize();  $.ajax({  type: "POST",  url: "/index.aspx",  processData:true,  data:formData,  success: function(data){  $("#result&quo

使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html

使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },"json"); 又或者是这样的ajax $.ajax({ url:"${pageContext.request.contextPath}/public/testupload", type:"post", data:{username:username},

【ASP.NET Web API教程】5.2 发送HTML表单数据:URL编码的表单数据

注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本系列教程,请先看前面的内容. 5.2 Sending HTML Form Data 5.2 发送HTML表单数据 本文引自:http://www.asp.net/web-api/overview/working-with-http/sending-html-form-data,-part-1 By Mike Wasson|June 15, 2012 作者:Mike Wasson | 日期:2012-6-15 Part

ASP.NET MVC 网站开发总结(五)——Ajax异步提交表单之检查验证码

首先提出一个问题:在做网站开发的时候,用到了验证码来防止恶意提交表单,那么要如何实现当验证码错误时,只是刷新一下验证码,而其它填写的信息不改变? 先说一下为什么有这个需求:以提交注册信息页面为例,一般注册都需要用户填一个验证码信息(防止机器恶意注册),并且这个验证码会提交到后台去进行比对,若是错了则不会检查其他提交信息而直接返回浏览器端提示验证码错误.若是简单地用form表单直接将数据提交到指定的url,当验证码填写错误的信息返回浏览器端的时候,不可避免整个页面都会重新刷新一次,这是用户所不想要

通过php jq ajax 提交form表单

参考http://www.php100.com/html/webkaifa/PHP/PHPyingyong/2013/0619/13568.html html <div id="contact_form"> <form name="contact" method="post" > <label for="name" id="name_label">姓名</label

jquery的ajax提交form表单方式总结

方法一: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx"; alert($('#formAddHandlingFee').serialize()); $.ajax({ type: "POST", dataType: "html", url: AjaxURL + '?Action=' + 'Submit

ajax提交form表单资料详细汇总

一.ajax提交form表单和不同的form表单的提交主要区别在于,ajax提交表单是异步提交的,而普通的是同步提交的表单.通过在后台与服务器进行少量数据交换,ajax 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新.传统普通的网页(不使用ajax)如果需要更新内容,必须重载整个网页页面. 二.通过ajax提交form实现的登录实例: <body> <h1 align="center">用户登录</h1> &

AJAX提交form表单带文件上传

过了三天才想要写博客,这样不好,要改正 在做毕设的时候,用户发帖涉及到了文件上传的问题,在这里记录一下 背景: 在用户发帖的时候,用户只想发表文字postText,还有些用户想在发表postText的同时还发表一些图片,如何做? 上代码 不写的太细了,和流水账似的,挑重点记录一下. 1.前台的文件上传 本来想用form表单直接上传了,但是form提交时会刷新整个页面,但这不是我想要的,所以使用了ajax提交form表单. 利用ajax提交表单需要用到jquery.form.js这个包,网上有很多