jQuery、ajax添加Json数据

需求说明：

简单的演示ajax提交json数据。

代码说明：

ajax在传输数据的时候基本格式大都是固定的，只需要修改传输类型即可。下面介绍基本的参数提交。

步骤一：建立一个html或者jsp页面，引入jquery-3.2.1.min.js（其他版本亦可）。

步骤二：在页面中添加输入框和提交按钮，给予id值。

步骤三：编写jquery、ajax提交数据到指定的controller。

<!DOCTYPE html>
<html lang="en">
<head><script src="jquery-3.2.1.min.js"></script><script>$(function () {$("#submitAB").click(function () {$.ajax({url: "http://localhost:8080/XXXXXXXX/XXXX/xxxx.do",type: "POST",datatype:"JSON",data: {parameter_A:$("#parameter_A").val(),parameter_B:$("#parameter_B").val()},success: function (data) {console.log("");},error: function () {alert("提交失败！");}});});});</script>
</head>
<body>
<body>parameterA:<input type="text" id="parameter_A" value="" /><br /><br />parameterB:<input type="text" id="parameter_B" value="" /><input type="button" value="submit" id="submitAB">
</body>
</body>
</html>复制代码

jQuery、ajax添加Json数据相关推荐

(thinkphp、jQuery)ajax返回json数据
Thinkphp部分代码: <?php namespace Yxg\Controller;use Think\Controller;class IndexController extends C ...
jQuery AJAX获取JSON数据解析多种方式示例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
ajax如何传递josn数据,jq之ajax以及json数据传递
闭包演示 function transfer(){ var dat = $( "#sel" ).val(); //console.log(dat) $.ajax({ type:&q ...
Ajax提交json数据,通过jquery.cookie.js插件解决csrf_token问题
html代码和js代码 <!doctype html> <html lang="en"> <head><meta charset=&quo ...
jquery ajax json传递数组,jQuery ajax 传递JSON数组到Spring Controller
jQuery ajax传递单个JSON对象到后台很容易,这里记录的是传递多个JSON对象组成的JSON数组到java 后台,并说明java如何解析JSON数组. 1.js代码 var relation ...
JavaWeb笔记：第07章 MVC |EL |JST |Filter |Listener |JQuery |AJAX |Maven |JSON |Redis |Linux |Nginx
JavaWeb笔记:第07章 MVC |EL |JST |Filter |Listener |JQuery |AJAX |Maven |JSON |Redis |Linux |Nginx 1. MVC ...
AngularJS学习笔记（3）——通过Ajax获取JSON数据
通过Ajax获取JSON数据以我之前写的与用户交互的动态清单列表为例,使用JSON前todo.html代码如下: <!DOCTYPE html> <html ng-app=&quo ...
Ajax（form表单文件上传、请求头之contentType、Ajax传递json数据、Ajax文件上传）
form表单文件上传上菜 file_put.html <form action="" method="post" enctype="multi ...
ajax加载vue数据,详解使用Vue.Js结合Jquery Ajax加载数据的两种方式
整理文档,搜刮出一个使用vue.js结合jquery ajax加载数据的两种方式的代码,稍微整理精简一下做下分享. 废话不多说,直接上代码 html代码 demo {{message }} 测试jqu ...

jQuery、ajax添加Json数据

jQuery、ajax添加Json数据相关推荐

最新文章

热门文章