XMLHttpRequest是原生ajax,缺点是使用起来比较繁琐。

jQuery库提供了一组简洁的ajax请求方法。

  • ajax()
  • get()
  • post()

具体使用参考官方API:

http://api.jquery.com/jQuery.ajax/

http://api.jquery.com/jQuery.get/

http://api.jquery.com/jQuery.post/

示例:

使用ajax() 获取服务端的数据

1
2
3
4
5
6
7
8
9
$.ajax({
    type : 'GET',
    dataType : 'json',
    data:{username: $('#username').val()} ,
    success : function(data) {
        console.log(data);             
    }  
});

使用ajax()提交数据到服务端

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var $id=$('#id').val();    
var $username=$('#username').val();
var $password=$('#password').val();    
var $age=$('#age').val();
     
$.ajax({
    type : 'POST',
    dataType : 'json',
    data:{id:$id,username:$username,password:$password,age:$age} ,
    success : function(data) {
        console.log(data); 
    }  
});

跨域 jQuery库ajax请求的更多相关文章

  1. 当跨域时,js ajax 请求出现options请求

    上面有文章说过http的options. 查了很久.试了很多版本的jQuery,下面这段代码在同事的机子上测试是没有问题的.正常 的请求, 一在我机子上面就会出现option,网上说先向服务器预检等. ...

  2. Ajax跨域(CROS)请求中的Preflighted requests

    Ajax跨域(CROS)请求中的Preflighted requests:https://www.aliyun.com/jiaocheng/862989.html 10 分钟理解跨域请求:https: ...

  3. 跨域GET、POST请求

    跨域GET.POST请求的小结 重点:跨域POST大量数据: JQuery:$.ajax/$.getJSON支持jsonp格式的跨域,但是只支持GET方式,暂不支持POST: CORS:w3c关于跨域 ...

  4. Sping MVC不使用任何注解处理(jQuery)Ajax请求(基于XML配置)

    1. Spring Spring框架是一个轻量级的解决方案,是一个潜在的一站式商店,用于构建企业就绪的应用程序.Spring框架是一个Java平台,为开发Java应用程序提供全面的基础架构支持.Spr ...

  5. 学习AJAX必知必会(4)~JQuery发送Ajax请求

    一.JQuery发送Ajax请求 ■ 对于get和post请求,jQuery内部封装了Ajax请求的4个步骤和数据格式的设置 ■ 对于Ajax通用请求,jQuery内部封装了Ajax请求的4个步骤和数 ...

  6. JSONP跨域的script标签请求为什么不受同源策略的限制?

    在复习跨域的时候,复习到了JSONP跨域,大家都知道JSONP跨域是通过动态创建script标签,然后通过其src属性进行跨域请求的,前端需要一个数据处理的回调函数,而服务端需要配合执行回调函数,放入 ...

  7. Struts2处理(jQuery)Ajax请求

    1. Ajax     Ajax(Asynchronous JavaScript and XML,异步JavaScript和XML)时一种创建交互式网页应用的网页开发技术,它并不是一项新的技术,其产生 ...

  8. Servlet处理(jQuery)Ajax请求

    1. jQuery     jQuery是一个JavaScript函数库,极大的简化了JavaScript编程,很容易学习.jQuery是目前最流行的开源js框架,并且提供了大量的扩展. 2. Aja ...

  9. jQuery发送ajax请求

    利用jquery发送ajax请求的几个模板代码. $.ajax({ async : false, type: 'POST', dataType : "json", url: &qu ...

随机推荐

  1. dubbo学习笔记1

    DUBBO入门 官方文档:https://dubbo.gitbooks.io/dubbo-user-book/content/preface/ 服务提供者 项目结构: pom文件: <?xml ...

  2. C++以const 作为返回值类型的意义

    const rational operator*(const rational& lhs, const rational& rhs); 很多程序员第一眼看到它会纳闷:为什么operat ...

  3. 百度echarts样式开发

    Echarts如何进行实例化 var a1 = null; a1= echarts.init(document.getElementById('a1')); a1.setOption({ color: ...

  4. Shell-find . -type f -name "*.jpg" -print | xargs tar -czvf images.tar.gz

    查找所有的 jpg 文件,并且压缩它们: find . -type f -name "*.jpg" -print | xargs tar -czvf images.tar.gz

  5. Linux虚拟机安装及环境搭建

    1.下载centos,地址:https://www.centos.org/download/ 下载时选择DVD ISO 2.使用VMware Workstation进行安装. 3.虚拟机网络配置    ...

  6. Minidump文件分析

    原文地址:blog.csdn.net/pkrobbie/article/details/6636310 简介 在过去几年里,崩溃转储(crash dump)成为了调试工作的一个重要部分.如果软件在客户 ...

  7. 2017.12.10《“剑锋OI”普及组多校联盟系列赛(14)#Sooke#Kornal 的课余时间 》分析报告

    报告内容如下 - - [导语] ------ 太晚了,时间也紧,一切尽量从简吧 PS:本文题目来自剑锋OI 所以废话也不多说,进入正题吧,代码直接跟在题目后边儿,主要分析在代码前,次要的就写在代码后面 ...

  8. zabbix批量监控urls的状态码

    .添加url监控脚本 [root@node1 usr]# vim /usr/local/zabbix_agents_3.2.0/scripts/web_site_code_status.sh #!/b ...

  9. python操作三大主流数据库(4)python操作mysql④python服务端flask和前端bootstrap框架结合实现新闻展示

    python操作mysql④python服务端flask和前端bootstrap框架结合实现新闻展示 参考文档http://flask.pocoo.org/docs/0.11/http://flask ...

  10. 缓存系列之三:redis安装及基本数据类型命令使用

    一:Redis是一个开源的key-value存储系统.与Memcached类似,Redis将大部分数据存储在内存中,支持的数据类型包括:字符串.哈希表.链表.集合.有序集合以及基于这些数据类型的相关操 ...