• jQuery学习教程(十):AJAX


    先复习一下经典的ajax方式

    ajax.php

    现在时间是<php? echo date('Y-m-d H:i:s');?>
    

    ajax.html

    <script type="text/javascript">  
    	function Ajax(){ 
    		var xmlHttp=null;  
    		if(window.ActiveXObject){  
    		try{  
    			xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");  
    		}catch(e){ 
    			try{  
    				xmlHttp=new ActiveXObject("Microsoft.XMLHTTP")  
    			}catch(e){} 
    		} 
    		}else if(window.XMLHttpRequest){  
    		xmlHttp=new XMLHttpRequest();  
    		}  
    		if(xmlHttp!=null){  
    			xmlHttp.open("GET","ajax.asp",true); 
    			xmlHttp.onreadystatechange=Call;  
    			xmlHttp.send(null);  
    		}  
    		var p=document.getElementById("content");  
    		function Call(){  
    			if(xmlHttp.readyState==4){  
    				if(xmlHttp.status==200){  
    					p.innerHTML=xmlHttp.responseText;  
    				} 
    			} 
    		}  
    	}
    </SCRIPT>
    <BUTTON onclick=Ajax()>获取</BUTTON>

    这里使用ajax算是有些麻烦

    再看看使用jQuery

    <script type="text/javascript">  
    	$(function(){  
    		$("button").click(function(){  
    		$("p").load("ajax.asp");  
    	});  
    });  
    </script>

    $.load()方法

    上面使用了load函数。load语法如下,

    load(url[,data][,callback])//url:string 类型,请求HTML页面的URl地址;data:Object类型,发送到服务器的key/value数据;callback,Function类型,请 求完成时的回调函数

    其中url可使用选择器接收该url中指定地址的某一元素内的文本。这是一个异常强大的功能,假如使用传统js方式的话就需要使用replace去 过滤某些字符,还可能要用到Regex。而现在jQuery只要简单的选择器过滤就可以了。

    $("p").load("ajax.php"),ajax.php内容如下:

    <h4>获取指定内容的标题</h4>  
    <p><?php
         echo data('Y-m-d H:i:s');
    ?></p>

    第二个参数data

    <script type="text/javascript">  
    	$(function(){  
    		$("button").click(function(){  
    			$("p").load("ajax_data.php",{name:"wang",age:"23"},function(responseText,textStatus,XmlHttp){  
    		alert("xmlHttp对象:" + XmlHttp + "\r\n请求状态:" + textStatus +   "\r\n获得数据:" + responseText); 
    			});  
    		});  
    	});  
    </script>
    

    ajax_data.php代码

    <?php
    	if $_POST("name")<>""{
    		echo "您的姓名为:" . $_POST("name");  
    		echo ",年龄是" . $_POST("age");  
    	}
    ?>
    

      

    其中参数{name:"王洪剑",age:"23"}显示声明时是以post方式来请求数据的;默认不加参数时以get方式请求。因此应当使用 request.Form("name")来获得数据。 callback代表载入返回数据后执行的函数,它有三个参数可供选择

    reponseText//返回的文本

    textStatus//请求状态:sucess|error|notmodified|timeout

    XmlHttpRequest//XmlHttpRequest对象,Object类型 

  • 相关阅读:
    springboot+maven+thymeleaf配置实战demo
    报错AbstractStandardExpressionAttributeTagProcessor
    IllegalStateException: Unable to find a @SpringBootConfiguration
    Java装饰模式
    Java容器类解析
    jdk之object源码理解
    osx brew mysql
    java String[] 初始化
    date 常用
    mac mysql
  • 原文地址:https://www.cnblogs.com/rmbteam/p/2113459.html
Copyright © 2020-2023  润新知