初学者-$.ajax基本使用

最新推荐文章于 2023-02-28 22:08:01 发布

EasyCome_EasyGo

最新推荐文章于 2023-02-28 22:08:01 发布

阅读量439

点赞数

分类专栏： php 前端文章标签： php jquery ajax 异步 json

本文链接：https://blog.csdn.net/u014238512/article/details/52277709

版权

php 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

前端

2 篇文章 0 订阅

订阅专栏

网页如果不使用AJAX的话，如果想更新内容必须要重载整个页面，使用AJAX后可以通过后台与服务器进行数据交换，使网页实现异步更新。使网页在不用重新加载整个页面的情况下刷新局部的数据，这样可以让用户有更好的浏览网页的体验。下面说一下jquery中的$.ajax基本用法。

下面是一个例子：

前端：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jquerytest</title>
    <script type="text/javascript" src="jquery-3.1.0.js"></script>
    <script type="text/javascript">
        $(function(){
            $('#div1').click(function(){
                $.ajax({
                url:'test.php',
                type:'post',
                dataType:'json',
                data:{},
                success:function(data){
                    alert(data.name)
                }

            })
            })
            

        })
    </script>
    <style type="text/css">
        #div1{
            height: 200px;
            width: 200px;
            background-color: blue;
        }
    </style>
</head>
<body>
    <div id="div1"></div>
</body>
</html>

服务器端：

<?php 	
$arr = array('name' => 'zhangsan' ,'age'=>'20','id'=>1965456 );
echo json_encode($arr) ;
 ?>

结果： zhangsan

type：提交方式‘post’或‘get’

url：提交给谁处理

dataType：预期服务器返回的数据类型，比如写json，当服务器返回json格式数据时会自动把json格式的字符串转化成可以方便直接使用的json对象，如果不指定，JQuery将自动根据http包mime信息返回responseXML或responseText，并作为回调函数参数传递。可用的类型如下：
xml：返回XML文档，可用JQuery处理。
html：返回纯文本HTML信息；包含的script标签会在插入DOM时执行。
script：返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时（不在同一个域下），所有post请求都将转为get请求。
json：返回JSON数据。
jsonp：JSONP格式。使用SONP形式调用函数时，例如myurl?callback=?，JQuery将自动替换后一个“?”为正确的函数名，以执行回调函数。
text：返回纯文本字符串。

data：要提交的数据，需要是对象格式或字符串的格式，对象->{name:'zhangsan',age:18,id=123456,...},字符串->'name=zhangsan&age=18$id=123456'

success：请求成功后的回调函数，参数：由服务器返回，并根据dataType参数进行处理后的数据；

EasyCome_EasyGo

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
初学者-$.ajax基本使用

网页如果不使用AJAX的话，如果想更新内容必须要重载整个页面，使用AJAX后可以通过后台与服务器进行数据交换，使网页实现异步更新。使网页在不用重新加载整个页面的情况下刷新局部的数据，这样可以让用户有更好的浏览网页的体验。下面说一下jquery中的$.ajax基本用法。下面是一个例子：前端： jquerytest //给这个
复制链接

扫一扫