<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

 </head>

 <body>

 <h1>ajax 发送post</h1>

     <input type="text"  value="" placeholder="请输入你爱吃的菜" id='foodText'>

     <input type="button"  value="ajaxPost请求" id='btnAjax'>

 </body>

 </html>

 <script type="text/javascript">

     document.querySelector("#btnAjax").onclick = function () {

         var ajax = new XMLHttpRequest();

         // 使用post请求

         ajax.open('post','ajax_post.php');

         // 如果 使用post发送数据 必须 设置 如下内容

         // 修改了 发送给 服务器的 请求报文的 内容

         // 如果需要像 HTML 表单那样 POST 数据，请使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定您希望发送的数据：

         ajax.setRequestHeader("Content-type","application/x-www-form-urlencoded");

         // 发送

         // post请求 发送的数据 写在 send方法中

         // 格式 name=jack&age=18 字符串的格式

         ajax.send('name=jack&age=998');

         // 注册事件

         ajax.onreadystatechange = function () {

             if (ajax.readyState==4&&ajax.status==200) {

                 console.log(ajax.responseText);

             }

         }

     }

 </script>

ajax 原生 post的更多相关文章

  1. Ajax原生写法

    用太久JQuery了,别忘了Ajax原生是怎么写的 var Ajax = { get : function (url, callback) { var req = Ajax.getRequest(ca ...

  2. HTML5+AJAX原生分块上传文件的关键参数设置

    processData:false 这是jquery.ajax的一个参数.默认值为true,表示会将非字符串对象自动变成k1=v1&k2=v2的形式,例如一个数组参数{d:[1,2]},到服务 ...

  3. Ajax原生请求和java对象转成json

    \黑马程序员_超全面的JavaWeb视频教程vedio\黑马程序员_超全面的JavaWeb教程-源码笔记\JavaWeb视频教程_day23-资料源码\ajax_code\day23_3 本代码中有模 ...

  4. JavaScript AJAX原生写法

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  5. C#构造方法(函数) C#方法重载 C#字段和属性 MUI实现上拉加载和下拉刷新 SVN常用功能介绍(二) SVN常用功能介绍(一) ASP.NET常用内置对象之——Server sql server——子查询 C#接口 字符串的本质 AJAX原生JavaScript写法

    C#构造方法(函数)   一.概括 1.通常创建一个对象的方法如图: 通过  Student tom = new Student(); 创建tom对象,这种创建实例的形式被称为构造方法. 简述:用来初 ...

  6. Ajax原生XHR对象

    前端学了有一段时间了,在项目中我通常使用的都是jQuery封装好的Ajax函数($.ajax.$.get.$.post),使用非常的简单方便,但为了更清楚的了解Ajax,需要学习原生xhr对象.   ...

  7. HTML5 + AJAX ( 原生JavaScript ) 异步多文件上传

    这是在上篇 HTML5 + AJAX ( jQuery版本 ) 文件上传带进度条 的修改版本.后台代码不变就可以接着使用,但是脚本不再使用jQuery了,改为原生的 JavaScript 代码,所以我 ...

  8. Ajax 原生和jQuery的ajax用法

    https://www.cnblogs.com/jach/p/5709175.html form数据的序列化: $('#submit').click(function(){ $('#form').se ...

  9. Ajax原生代码

    Ajax传数据有两种方式:get/post.下面是前台的get/post方式的代码. //------------原生--------- function AjaxGET(){ //第一步 调用Aja ...

  10. Jquery揭秘系列：ajax原生js实现

    讲到ajax这个东西,我们要知道两个对象XMLHTTPRequest和ActiveXObject ,提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求 ...

随机推荐

  1. vue2.0：（三）、项目开始，首页入门（main.js，App.vue,importfrom）

    接下来,就需要对main.js App.vue 等进行操作了. 但是这就出现了一个问题:什么是main.js,他主要干什么用的?App.vue又是干什么用的?main.js 里面的import fro ...

  2. python搭建ftp服务器

    1 # coding: utf-8 import os from pyftpdlib.authorizers import DummyAuthorizer from pyftpdlib.handler ...

  3. 【R语言进行数据挖掘】回归分析

    1.线性回归 线性回归就是使用下面的预测函数预测未来观测量: 其中,x1,x2,...,xk都是预测变量(影响预测的因素),y是需要预测的目标变量(被预测变量). 线性回归模型的数据来源于澳大利亚的C ...

  4. （五）maven之外置maven

    eclipse外置maven eclipse内置的maven插件是固定版本,如果要用其他版本的maven,可以使用外置maven. ①    在菜单栏上点击“Windows”à“Preferences ...

  5. SAP CRM中间件下载equipment时遇到的一个错误

    在CRM开发系统上进行equipment下载,发现不工作.调试发现错误信息在下图定96行的WHEN default分支抛出的: MESSAGE ID 'AZ' ... 通过阅读源代码发现,ERP端支持 ...

  6. 网络大牛如何回答Chrome的15个刁钻面试题？

    (内容来自网络整理) Google的面试题在刁钻古怪方面相当出名,甚至已经有些被神化的味道.这里整理出15道Google面试题并一一给出了网络大牛的答案,其中不少都是流传很广的. 第1题:让你清洗西雅 ...

  7. spark 之主成分分析

    C4∗2

  8. apache shiro的工作流程分析

    本文基于shiro的web环境,用宏观(也就是不精确)的角度去理解shiro的工作流程,先看shiro官方的一张图. 和应用程序直接交互的对象是Subject,securitymanager为Subj ...

  9. 数据库-SQL语法：GROUP BY与HAVING

    注意:select 后的字段,必须要么包含在group by中,要么包含在having 后的聚合函数里. 1. GROUP BY 是分组查询, 一般 GROUP BY 是和聚合函数配合使用. grou ...

  10. Sql Server 自动备份

    1)启动代理服务 服务->Sql server 代理启动 2)设置维护计划 维护计划->设置维护计划向导->修改名称及说明 3)更改计划 4)选择维护任务 5)顺序调整不做解释 6) ...