原生js中用Ajax进行get传参

  案例:

  <!DOCTYPE html>
  <html>
    <head>
      <meta charset="UTF-8">
      <title></title>
      <style>
        input{
          width:600px;
          height:50px;
          display:block;
        }
      </style>
    </head>
    <body>
      <input type="text" name="id" id="id" value="3"/>
      <input type="text" name id="text" value="zhangsan"/>
      <input type="text" nane="money" id="money" value="1000"/>
      <input type="text" name="bumen" id="bumen" value="web"/>
    </body>
  </html>
  <script>
    //用原生写;
    //首先,Ajax;封装版  get方式
    function ajax(medth,url,fn,data){
      var xmlhttp=new XMLHttpRequest;
      xmlhttp.open(medth,url+"?"+data,true);             //url  和  data要是字符串  ,但是必须是传值时是字符串,这里是变量url data   所以用+拼接起来,中间用必须?连接起来
      xmlhttp.send();
      xmlhttp.onreadystatechange=function(){
        if(xmlhttp.readyState==4&&xmlhttp.status==200){
          fn(xmlhttp.responseText);
        }
      }
    }
    function $(name){
      return document.getElementById(name);
    }
    var so=$("id").value;              // 获取表单的值
    var ss=$("text").value;
    var mo=$("money").value;
    var bu=$("bumen").value;
    var js="id="+so+"&name="+ss+"&money="+mo+"&bumen="+bu;        //传数据的格式;(不管get还是post通用)   &符   表示and的意思    js要是字符串   所以可以用+进行字符串拼接;
    console.log(js); 
    ajax("get","http://192.168.43.229:8088/seven/4.12/admin/02.php",mn,js);
    function mn(data){
      console.log(data);                               //在php中获取的数据
    }
  </script> 

  <?php
    $so=$_GET['id'];    //用get获取id的字段    与js中的id一致;

    $ss=$_GET['name'];
    $mo=$_GET['money'];
    $bu=$_GET['bumen'];
    $arr=[];
    array_push($arr,$so,$ss,$mo,$bu);            //将他们放在数组里
    var_dump($arr);              //只能用var_dump展示出来;
?>

原生js中用Ajax进行get传参的更多相关文章

  1. 用原生js实现ajax、jsonp

    转载: http://www.cnblogs.com/yangheng/p/6065910.html 一.原生js实现ajax $.ajax({ url: '', type: 'post', data ...

  2. 原生js实现Ajax

    一般来说,大家可能都会习惯用JQuery提供的Ajax方法,但是用原生的js怎么去实现Ajax方法呢? JQuery提供的Ajax方法: $.ajax({ url: , type: '', dataT ...

  3. 原生js写Ajax

    //原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.挺对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...

  4. [javascript]原生js实现Ajax

    一.首先看JQuery提供的Ajax方法: $.ajax({ url: , type: '', dataType: '', data: { }, success: function(){ }, err ...

  5. js中使用进行字符串传参

    在js中拼接html标签传参时,如果方法参数是字符串需要加上引号,这里需要进行字符转义 <a href='javascript:addMenuUI("+"\"&qu ...

  6. ajax的data传参的两种方式

    ajax的data传参的两种方式 本文为转载. 1.[javascript] view plain copy /** * 订单取消 * @return {Boolean} 处理是否成功 */ func ...

  7. 使用原生js写ajax

    // 使用原生js 封装ajax // 兼容xhr对象 function createXHR(){ if(typeof XMLHttpRequest != "undefined") ...

  8. 表单验证--通过原生js模仿ajax的异步交互

    今天给大家带来个福利,我也是刚刚学习的很实用的一个东西,通过原生js模仿ajax的异步交互. 我的博客只是给那些新手看的大神勿喷,写的不好可留言,请指出. 因为当初自己学的时候一个问题不会找人问,知道 ...

  9. 原生JS实现Ajax及Ajax的跨域请求

      前  言          如今,从事前端方面的程序猿们,如果,不懂一些前后台的数据交互方面的知识的话,估计都不太好意思说自己是程序猿.当然,如今有着许多的框架,都有相对应的前后台数据交互的方法. ...

随机推荐

  1. API的控制器

    // GET: api/showApi /// <summary> /// 显示 查询 /// </summary> /// <param name="name ...

  2. mac 常用终端命令

      mkdir 文件夹夹名称 创建一个文件夹 cd 文件夹名称 进入该文件夹 git init 在该文件夹下创建一个git仓库 touch 文件名称 在该文件夹下创建一个文件 echo '内容' &g ...

  3. 查看selinux与关闭方法

    查看当前用户selinux 状态 [root@o- ~]# getenforce Disabled [root@o- ~]# setenforce usage: setenforce [ Enforc ...

  4. SharePoint Framework Extensions GA Release

    博客地址:http://blog.csdn.net/FoxDave SharePoint Framework Extensions GA版本已经发布了,介于最近个人工作的变动调整,还没时间好好了解一下 ...

  5. python脚本 FTP上传学习

    学习了这个博文http://www.cnblogs.com/cacique/archive/2012/08/24/2653686.html,楼主这个文章很适合初学者,所以根据楼主的内容推演了下上传文件 ...

  6. php优秀框架codeigniter学习系列——CI_Router类学习

    这篇文章主要介绍CI核心框架工具类CI_Router. 如果说CI_URI类是用来解析URI,那么CI_Router类就应该是根据解析出来的URI来决定究竟访问哪一个文件和哪一个function. 详 ...

  7. [转]C++11 左值、右值、右值引用详解

    https://blog.csdn.net/hyman_yx/article/details/52044632 左值.右值 在C++11中所有的值必属于左值.右值两者之一,右值又可以细分为纯右值.将亡 ...

  8. 创建Java多线程的两种方式和线程异常

    一.使用多线程的两种方法  使用多线程的两种方法有:继承Thread类和实现runable接口. 二.继承Thread类 来看一下thread类的源代码: class Thread implement ...

  9. Spring history&Design Philosophy 简单介绍~

    SPRING框架的介绍和历史 Spring Framework是一个开源Java应用程序框架,最初是基于依赖注入(DI)和控制反转(IoC)的原理开发的. Spring Framework已经成长为控 ...

  10. python中sys和os模块的使用

    在python中,sys,os模块是非常强大的,提供了许多对文件夹.文件和路径的操作方法 sys模块 sys.argv   #命令行执行脚本,其实它就是一个列表 ,sys.argv[0] 是程序自身路 ...