ajax 请求接口实例
通过 HTTP 请求加载远程数据。
jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。
最简单的情况下,$.ajax()可以不带任何参数直接使用。
注意,所有的选项都可以通过$.ajaxSetup()函数来全局设置。
回调函数
如果要处理$.ajax()得到的数据,则需要使用回调函数。beforeSend、error、dataFilter、success、complete。
jquery API地址:https://jquery.cuishifeng.cn/jQuery.Ajax.html
<!-- 表单部分 -->
<form action="#" onsubmit="return false" method="post" id="form">
<input type="text" value="" placeholder="公司名称" id="lyname" name="name" required="required" style="float: left;" maxlength="20" class="mar_m" />
<input type="text" value="" placeholder="您的手机" id="lytel" name="tel" required="required" style="float: right;" maxlength="11" id="phone" onblur="checkPhone()" />
<div style="clear:both"></div>
<input type="text" name="remark" id="lyremark" value="" placeholder="留言内容" class="content" />
<div id="" class='send'>
<button type="submit" onclick="login()">提交</button></div>
</form>
<!-- js部分 -->
// ajax表单提交
function login() {
// alert("remark:"+ $('#lyremark').val()+"name:"+ $('#lyname').val()+"tel:"+ $('#lytel').val())
$.post("您的接口地址", {
//获取用户输入的值,也是要传到后台的字段
remark: $('#lyremark').val(),
name: $('#lyname').val(),
tel: $('#lytel').val(),
//以下为不需要获取的字段,留空即可
tel_spare: "",
source: "官网",
group: "",
record_user_name: "",
owner_name: "",
type: null,
record_user: null,
owner: null,
department: null
},
//请求成功之后执行的函数
function(result) {
console.log(result);
// 请求成功后把值清空
$('#lyremark').val('');
$('#lyname').val('');
$('#lytel').val('');
//提示信息
alert('您已提交成功!');
});
}
ajax 请求接口实例的更多相关文章
- 使用ajax请求接口,跨域后cookie无法设置,全局配置ajax;及使用axios跨域后cookie无法设置,全局配置axios
问题一: 使用ajax/axios跨域请求接口,后端放行了,能够正常获取数据,但是cookie设置不进去,后端登录session判断失效 ajax解决办法: //设置ajax属性 crossDomai ...
- Ajax请求接口加密研究(针对网页前端的接口安全加密机制研究)
通常我们在h5前端调用后台接口时,一般是ajax,那么接口的安全成了一个问题. 这里可以肯定的说,前端调用的接口一定要验证! 然后剖析了微信网页版.京东网页版这些,也都是通过接口的形势绑定数据,所以在 ...
- HttpClient请求接口实例demo
HttpClient是Apache中的一个开源的项目.它实现了HTTP标准中Client端的所有功能,使用它能够很容易地进行HTTP信息的传输.HttpClient的主要功能: 实现了所有 HTTP ...
- ajax请求接口数据
var api = 'http://192.168.68.208:666/ajax/api.ashx'; // api += 'action=/api/blackhistory/list&ke ...
- Python 简单批量请求接口实例
#coding:utf-8 ''' Created on 2017年11月10日 @author: li.liu ''' import urllib import time str1=''' http ...
- web api 解决Ajax请求跨域问题
前端ajax请求接口时,经常出现跨域问题,当然了解决方法有很多种,比如: http://www.jb51.net/article/68424.htm 我本人恰好前后端都会一点,所以直接在接口端处理. ...
- ajax请求执行完成后再执行其他操作(jQuery.page.js插件使用为例)
就我们做知,ajax强大之处在于它的异步请求,但是有时候我们需要ajax执行彻底完成之后再执行其他函数或操作 这个时候往往我们用到ajax的回调函数,但是假如你不想或者不能把接下来的操作写在回调函数中 ...
- ajax请求node.js接口时出现 No 'Access-Control-Allow-Origin' header is present on the requested resource错误
ajax请求node.js接口出现了如下的错误: XMLHttpRequest cannot load http://xxx.xxx.xx.xx:8888/getTem?cityId=110105&a ...
- IE浏览器下使用AJAX登陆接口请求缓存与登陆不了的问题解决
问题: 在IE浏览器下面,登陆的时候老是登陆不上,但是打开控制台的时候再登陆却能登陆上. 分析: 通过抓包,发现,在不打开控制台的时候,少了一个接口的请求,却返回了改接口的返回信息,但是返回信息并不是 ...
- 解决Ajax请求后台Servlet接口拿不到JSON数据问题
前端Ajax请求代码如下: window.onload=function() { var url='http://127.0.0.1:8080/testpj/ErrorlogServlet'; $.a ...
随机推荐
- 【Azure Developer】.Net 简单示例 "文字动图显示" Typing to SVG
问题描述 看见一个有趣的页面,可以把输入的文字信息,直接输出SVG图片,还可以实现动图模式. 示例URL: https://readme-typing-svg.demolab.com/?font=F ...
- Linux下的权限(角色,文件权限)
目录 1.什么是权限 2.文件类型及权限 ①Linux文件类型: ②剩余9个字符对应的含义: ③文件权限值的表示方法(进制法) 3.如何操作权限 3.1改变权限的命令操作 chmod #change ...
- 一些奇奇怪怪的js知识
0.关于前端为什么typeof null 得到的结果是 object 对于 null 来说,很多人会认为他是个对象类型,其实这是错误的. 虽然 `typeof null` 会输出 `object`,但 ...
- js 连接数据库 提示:ActiveXObject is not defined
ActiveXObject is not defined 最近比较闲,上班瞎捣鼓一下,没想到报错了,提示ActiveXObject is not defined 大概是在js连接数据库时new对象使用 ...
- 力扣628(java)-三个数的最大乘积(简单)
题目: 给你一个整型数组 nums ,在数组中找出由三个数组成的最大乘积,并输出这个乘积. 示例 1: 输入:nums = [1,2,3]输出:6示例 2: 输入:nums = [1,2,3,4]输出 ...
- 如何从 0 到 1 开发 PyFlink API 作业
简介: 以 Flink 1.12 为例,介绍如何使用 Python 语言,通过 PyFlink API 来开发 Flink 作业. Apache Flink 作为当前最流行的流批统一的计算引擎,在实时 ...
- [GPT] nodejs 有哪些类似 jquery 语法的 html 解析库
在Node.js中,有一些类似jQuery语法的HTML解析库可供选择. 以下是其中几个常用的库: 1. Cheerio: Cheerio是一个快速.灵活且易于使用的HTML解析库,它提供了类似于 ...
- WPF 双向绑定到非公开 set 方法属性在 NET 45 和 NET Core 行为的不同
本文记录 WPF 在 .NET Framework 4.5 和 .NET Core 3.0 或更高版本对使用 Binding 下的 TwoWay 双向绑定模式绑定到非公开的 set 属性上的行为变更 ...
- Partition和ReduceTask的关系
先看源码: numPartitions = conf.getNumReduceTasks(); if (numPartitions > 1) { //设置了ReduceTask个数后(大于1), ...
- 【GUI软件】小红书搜索结果批量采集,支持多个关键词同时抓取!
目录 一.背景介绍 1.1 爬取目标 1.2 演示视频 1.3 软件说明 二.代码讲解 2.1 爬虫采集模块 2.2 软件界面模块 2.3 日志模块 三.获取源码及软件 一.背景介绍 1.1 爬取目标 ...