Ajax 简单的实例代码

最新推荐文章于 2025-03-01 12:05:09 发布

礼貌先生

最新推荐文章于 2025-03-01 12:05:09 发布

阅读量1.1w

点赞数 7

分类专栏： ajax 文章标签： ajax javascript xml 异步编程语言

本文链接：https://blog.youkuaiyun.com/wu_ning/article/details/59630497

版权

ajax 专栏收录该内容

1 篇文章

订阅专栏

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

AJAX 不是新的编程语言，而是一种使用现有标准的新方法。

AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。

    HTML Code  
 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

<!DOCTYPE HTML>
<html>
<head>
<script src= "http://libs.baidu.com/jquery/2.0.0/jquery.js" ></script>
<script type= "text/javascript" >
    $(function(){
         //按钮单击时执行
        $( "#testAjax").click(function(){

               //Ajax调用处理
            $.ajax({
               type: "POST", //规定传输方式
               url: "new.php", //提交URL
               data: { 'name':$( '#name').val(), 'age':$( '#age').val()}, //提交的数据
               success: function(data){
                        $( "#myDiv").html( '<h2>'+data+ '</h2>'); //交互成功回调
                  }
            });

         });
    });
</script>
</head>
     <body>
         <input type= "text" name= "name" id= "name" ><br/>
         <input type= "text" name= "age" id= "age" ><br/>
         <div id= "myDiv" ><h2>通过 AJAX 改变文本 </h2></div>
         <button id= "testAjax" type= "button" >Ajax改变内容 </button>
     </body>
</html>