$("#btn").click(function () {

    var wanted_code = $("#wanted_code").children('option:selected').val();

    var wanted_man_name = $("#wanted_man_name").val();

    $.ajax({

        url: '/create_wanted',

        type: 'POST', // 调用post方法类型

        dataType: 'JSON',

        contentType: 'application/json,charset=utf-8', //设置请求头，入参为JSON格式

        data: JSON.stringify({'wanted_code': wanted_code, 'wanted_man_name': wanted_man_name}), // 传参，并序列化

        async: false, // false-异步

        beforeSend: function () {

            // $("#show").html('通缉中...');

            $("#loading").attr({"hidden": false});

        }, // beforeSend 调用前页面展示内容

        success: function (result) {

            $("#show").html('流水号：' + result + '，通缉完成');

            $("#loading").attr({"hidden": true});

        }  // success 异步调用成功后在页面填充内容

    });

    $.ajax({

        url: '/pic_generator',

        type: 'POST',

        data: {'code': waybill_no},

        async: false,

        success: function (result) {

            $("#pic").attr("src", result);

        }

    })

});




Tips：


1.可以此方法写入.js，放入static下，html内部引用此脚本。




<script type="text/javascript" src="../static/js/create_wanted.js"></script>




2.同时可以在<head>中引入jQuery。




<script type="text/javascript" src="../static/js/jquery-3.6.0.min.js"></script>




3.特别注意：jq-ajax发送post请求时对于一个JSON obj，需要先序列化JSON.stringify()，然后设置contentType:'application/json,charset=utf-8'来发送JSON格式的报文给后端。




        dataType: 'JSON',

        contentType: 'application/json,charset=utf-8', //设置请求头，入参为JSON格式

        data: JSON.stringify({'wanted_code': wanted_code, 'wanted_man_name': wanted_man_name}), // 传参，并序列化


												


											
【JavaScript】JS写法随笔(一) Ajax写法的更多相关文章
	

    
						
  1. Javascript模块化编程：模块的写法
		
    声明:本文转载自:阮一峰的网络日志,原文地址http://www.ruanyifeng.com/blog/2012/10/javascript_module.html,http://www.ruany ...
    
		
    2. 
						
  2. JavaScript复杂判断的更优雅写法
		
    摘要: 写代码是一门艺术. 原文:JavaScript 复杂判断的更优雅写法 作者:Think. 公众号:大转转fe Fundebug经授权转载,版权归原作者所有. 前提 我们编写js代码时经常遇到复 ...
    
		
    3. 
						
  3. javascript中面向对象的5种写法
		
    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
    
		
    4. 
						
  4. [JS] 面向对象的5种写法和拓展JS对象的写法
		
    面向对象的JAVA  最开始当然是对象的定义了 收集了以下的五种写法 //第1种写法 function Circle(r) { this.r = r; } Circle.PI = 3.14159; C ...
    
		
    5. 
						
  5. 【写法总结】$.ajax与$.post、$.get  写法区别
		
    原文: https://www.cnblogs.com/asdyzh/p/9807264.html   后台代码: [HttpPost] public string DoLogin(string us ...
    
		
    6. 
						
  6. JavaScript   事件(捕获和冒泡 兼容性写法)
		
    事件    浏览器客户端上客户触发的行为都称为事件 所有的事件都是天生自带的 不需要人为绑定 只需要我们去触发通过obj.事件名=function(){} 我们给元素的事件绑定了一个方法 事件名:on ...
    
		
    7. 
						
  7. js、jQuery、ajax面试题
		
    1.javascript的typeof返回哪些数据类型. 答案:string,boolean,number,undefined,function,object 2.例举3种强制类型转换和2种隐式类型转 ...
    
		
    8. 
						
  8. 《高性能javascript》 领悟随笔之-------DOM编程篇(二)
		
    <高性能javascript> 领悟随笔之-------DOM编程篇二 序:在javaSctipt中,ECMASCRIPT规定了它的语法,BOM实现了页面与浏览器的交互,而DOM则承载着整 ...
    
		
    9. 
						
  9. 【转】关于URL编码/javascript/js url 编码/url的三个js编码函数
		
    来源:http://www.cnblogs.com/huzi007/p/4174519.html 关于URL编码/javascript/js url 编码/url的三个js编码函数escape(),e ...
    
		
    10. 
						
  10. 关于URL编码/javascript/js url 编码/url的三个js编码函数
		
    关于URL编码/javascript/js url 编码/url的三个js编码函数escape(),encodeURI(),encodeURIComponent() 本文为您讲述关于js(javasc ...
    
		
    11. 
		

	


随机推荐
	

    
									
  1. Win10家庭版找不到组策略gpedit.msc怎么办
			
    Win10家庭版找不到组策略gpedit.msc怎么办 @echo off pushd "%~dp0" dir /b %systemroot%\Windows\servicing\ ...
    
			
    2. 
						
  2. MySQL连接提示 public key retrieval is not allowed
			
    使用DBeaver连接mysql数据提示public key retrieval is not allowed 修改DBeaver的驱动属性中的allowPublicKeyRetrieval
    
			
    3. 
						
  3. python的开发工具pycharm的安装
			
    如何下载 如何安装 如何配置环境 (mac和win版本) Pycharm的安装与配置以及汉化 一.pycharm的安装与配置(一定要去pycharm的官网去下载哦!) 1.最受欢迎的开发工具pycha ...
    
			
    4. 
						
  4. DevExpress控件显示弹出注册对话框的应对方法
			
    删除Properties下的license.licx,目前来看是可以的 已测试,可以不显示注册对话框
    
			
    5. 
						
  5. 【Python实例】用脚本自动拿一个或多个仿真环境
			
    注1:之前使用的是perl,现在尝试切换到python; 注2:该脚本用于实现自动拿仿真环境,里面应该还有很多不足之处,后续逐渐完善; 注3:假设脚本名字为get_env.py,直接执行脚本,会有两次 ...
    
			
    6. 
						
  6. vue3插槽变化
			
    1.默认插槽还是跟以前一样 2.使用具名插槽时,子组件不变 以前的父组件掉用的时候 <template slot="example"> </template> ...
    
			
    7. 
						
  7. 将含两列的csv文件生成二维矩阵
			
    gen_diea=pd.read_csv('../data/ddg_data/diea-gene.csv', header=None, names=['diease','gene']) #生成关联矩阵 ...
    
			
    8. 
						
  8. win11 改键盘映射
			
    编辑注册表:按下win+r,输入regedit找到这个路径HKEY_LOCAL_MACHINE\ SYSTEM\ CurrentControlSet\ Control\ Keyboard Layout ...
    
			
    9. 
						
  9. jquery 操作表格 jQuery操作表格（table）的常用方法、技巧汇总
			
    以下列出13个jQuery操作table常用到的功能: 1.鼠标移动行变色 $('#table1 tr').hover(function(){ $(this).children('td').addCl ...
    
			
    10. 
						
  10. C#windows 服务 《转载》
			
    转自:https://blog.csdn.net/Code_May/article/details/123909870 c#应用Windows服务 背景 一.创建windows服务 1.创建windo ...
    
			
    11.