当前位置:首页 > 开发 > Web前端 > Ajax > 正文

ajax的get请求

发表于: 2015-11-13   作者:互联网   来源:转载   浏览次数:
摘要: get和post是http请求方法最主要的两种方式。 get: 先实现一个简单的get请求 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Docume

get和post是http请求方法最主要的两种方式。

get:

先实现一个简单的get请求

index.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="utf-8">

    <title>Document</title>

</head>

<body>

    <input type="button" id="submit" value="submit">

    <div id="txt"></div>

<script>

/*对象监听*/

document.getElementById("submit").onclick = function(){

    get("example.php?name=fuduji&age=23",function(data){

        document.getElementById("txt").innerHTML = data;//请求成功则执行此操作

    },true)

}

/*简单的一个get函数封装*/

function get(url,callback,async){//3个参数,url表示请求地址,async表示是否异步,callback表示一个回调函数

    var xhr = new XMLHttpRequest();

    var url = urlParam(url); //编码

    async = async ? async : true;//是否异步

    xhr.onreadystatechange = function(){

        if(xhr.readyState ==4){

            callback(xhr.responseText); //回调

        }

    }

    xhr.open("get",url,async);

    xhr.send(null);

}

/*对请求的url进行uri组件编码*/

function urlParam(url){

    var arr = url.split("?");

    var location = arr[0];

    var uri = arr[1];

    var arr1 = uri.split("&");

    for(var i =0; i<arr1.length; i++){

        var arr2 = arr1[i].split("=");

        var name = encodeURIComponent(arr2[0]);

        var value = encodeURIComponent(arr2[1]);

        arr1[i] = name + "=" + value;

    }

    uri = arr1.join("&");

    arr = location + "?" + uri;

    return arr;

}

</script>

</body>

</html>

example.php

<?php

echo 'hello '.$_GET['name'].',your age is '.$_GET['age'];

?>

说明一下:get参数中,url是必须进行正确编码(encodeURIComponent),get请求经常出错就在这个地方,还有一个问题是缓存问题,如果请求页面被设置缓存,而你不想要缓存,可以在urlParam返回值中加上Math.random()用来告诉服务器,这是不同的请求;另外一个参数是设置是否异步,一般而言是必须设置为异步的,同步会阻塞js执行或者页面渲染,在本示例中可能无法看出来。

 

ajax的get请求

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
使用jQuery的$.get方法可以以GET方式发起AJAX请求。$.get方法是jQuery的实用工具函数。 get方法语法
写在前面的话 我们在使用Ajax时,当我们向服务器发送数据时,我们可以采用Get方式请求服务器,也可以使
写在前面的话 我们在使用Ajax时,当我们向服务器发送数据时,我们可以采用Get方式请求服务器,也可以使
1.判断是POST/GET请求 这个大家都知道了,就是$_SERVER['REQUEST_METHOD'] 返回用户的请求方式; i.e.
写在前面的话 我们在使用Ajax时,当我们向服务器发送数据时,我们可以采用Get方式请求服务器,也可以使
在chrome,ff中发送ajax请求get内容时没有缓存的现象,但是在IE中会对请求进行缓存,从而导致更新的
本人最近工作不太忙抽点时间简单学一下Ajax,特此借鉴前辈经验。 文章来源:http://www.cnblogs.com
hidden frame技术有四个步骤: 1.用户通过可见的frame与页面交互,而意识不到hidden frame,当用户
写一个ASP.NET MVC例子,它是使用jQuery的$.Ajax来呼叫控制器的数据。 创建一个视图: 运行结果:
本人最近工作不太忙抽点时间简单学一下Ajax,特此借鉴前辈经验。 文章来源:http://www.cnblogs.com
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号