jQuery学习笔记--jQuery Ajax

最新推荐文章于 2024-04-19 15:29:12 发布

thystar

最新推荐文章于 2024-04-19 15:29:12 发布

阅读量397

点赞数

分类专栏： web前端

本文链接：https://blog.csdn.net/thystar/article/details/47948871

版权

web前端专栏收录该内容

20 篇文章 0 订阅

订阅专栏

1. 简介：

参考：http://www.runoob.com/jquery/jquery-ajax-intro.html

AJAX = 异步 JavaScript 和 XML（Asynchronous JavaScript and XML）。

简短地说，在不重载整个网页的情况下，AJAX 通过后台加载数据，并在网页上进行显示。

jQuery 提供多个与 AJAX 有关的方法。

通过 jQuery AJAX 方法，您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。

2. jQuery Ajax异步访问

应用：显示输入框中的内容：

.php

<?php
if(isset($_GET['name'])){
    echo "hello".$_GET['name'];
}else{
    echo "Args Error";
}

.js

$(document).ready(function(){
    $("#btn").on("click", function () {
        $.get("sever.php",{name:$("#nameval").val()}, function (data) {
           $("#result").text(data);
        });
    });
});

.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="js/jquery-2.1.4.min.js"></script>
    <script src="js/ajaxindex.js"></script>
</head>
<body>
    <input type="text" id="nameval">
    <br>
    <button id="btn">send</button>
    结果：<span id="result"></span>
</body>
</html>

在现实结果时，页面没有刷新，只是更改结果