Ajax打开三种页面的请求

xmlhttprequest对象可以打开两种方式的页面请求

1，.asmx格式的webservice页面。

2，.aspx格式的web窗体

其中web窗体可以是调用一新建的web窗体，同时调用和被调用页面可以是同一个页面，表达的可能不够清楚，还是看示例吧。

一、调用.asmx格式的webservice页面

1，新建一个ASP.NET应用程序，在该应用程序中添加一web服务页面（webservice页面），此时项目中有三个页面，web窗体页面（Default.aspx）、webservice页面（WebSerVice.asmx)和配置页面（Web.config)，为了能够使用HTTP GET 方式访问web服务，需要在Web.config文件中的<system.web></system.web>标签对中加入如下配置

<webServices >
         <protocols >
           <add name ="HttpGet"/>
         </protocols>
       </webServices>

2，在WebSerVice.asmx文件中写一个方法getResult，该方法接受两个字符型的参数，其中的WebMethod属性不可以漏掉。。。

public class WebService : System.Web.Services.WebService
    {
        [WebMethod]
        public string getResult(string  str1,string  str2)
        {
            return "输入的第一个字符串是：" + str1 + "\n输入的第二个字符串是：" + str2;
        }
    }

3，布局Default.aspx文件如下

4，在Default.aspx文件中写入如下JavaScript脚本

<script language="javascript" type ="text/javascript" >
    //以下为创建xmlHttpRequest对象
    var xmlHttpRequest=false;
    try
    {
xmlHttpRequest=new XMLHttpRequest();//非IE浏览器
    }
    catch (microsoft)//IE浏览器
    {
        try
        {
            xmlHttpRequest=new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (othermicrosoft)
        {
            try
            {
                xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (failed)
            {
                xmlHttpRequest=false;
            }
        }
    }
   
    if (!xmlHttpRequest)
    {
        alert("不能初始化XMLHttpRequest对象！");
    }
   
    //相应button的Click事件
    function callback()
    {
        var arg1=document.getElementById ("Text1").value;//获取Text1文本框的值
        var arg2=document.getElementById ("Text2").value;//获取Text2文本框的值
        var url="WebService.asmx/getResult?str1="+escape(arg1)+"&str2="+escape(arg2);//要打开的url地址，并传递两个参数，这里参数名必须同webservice提供的参数名一致
        xmlHttpRequest.open("get",url,true);//以get方式打开指定的url请求，并且使用的是异步调用方式（true）
        xmlHttpRequest.onreadystatechange=updatePage;//指定回调函数updatePage
        xmlHttpRequest.send(null);//发送请求，由于是get方式，这里用null
    }
   
    //回调函数
    function updatePage()
    {
        if (xmlHttpRequest.readyState==4)
        {
            if (xmlHttpRequest.status==200)
            {
                var response=xmlHttpRequest.responseXML;//以xml格式回调内容
                var result;
                if (response.evaluate)//XML Parsing in Mozilla
                {
                    result=response.evaluate("//text()",response,null,XpathResult.STRING_TYPE,null).stringValue;//Mozilla中获取xml中的文本内容
                }
                else
                {
                    //XML Parsing in IE
                    result=response.selectSingleNode("//text()").data;//IE中获取xml中的文本内容
                }
                document.getElementById ("TextArea1").value=result;
            }
        }
    }
   
    </script>

5，运行，是不是看到自己想看到的结果。这就是ajax打开webservice页面请求的方式

二、调用.aspx格式的web窗体（新建web窗体）

1，在上面新建的ASP.NET应用程序中添加一名为ReturnStr的web窗体，在ReturnStr.aspx.cs文件中的Page_Load事件中添加如下代码：

Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/

-->protected void Page_Load(object sender, EventArgs e)
        {
            string str1 = Request["argA"].ToString();
            string str2 = Request["argB"].ToString();
            Response.Write("输入的第一个字符串是：" + str1 + "\n输入的第二个字符串是：" + str2);
        }

2，修改Default.aspx文件中的JavaScript脚本如下

<script language="javascript" type ="text/javascript" >
    //以下为创建xmlHttpRequest对象
    var xmlHttpRequest=false;
    try
    {
xmlHttpRequest=new XMLHttpRequest();//非IE浏览器
    }
    catch (microsoft)//IE浏览器
    {
        try
        {
            xmlHttpRequest=new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (othermicrosoft)
        {
            try
            {
                xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (failed)
            {
                xmlHttpRequest=false;
            }
        }
    }
   
    if (!xmlHttpRequest)
    {
        alert("不能初始化XMLHttpRequest对象！");
    }
   
    //相应button的Click事件
    function callback()
    {
        var arg1=document.getElementById ("Text1").value;//获取Text1文本框的值
        var arg2=document.getElementById ("Text2").value;//获取Text2文本框的值
        var url="ReturnStr.aspx?argA="+escape(arg1)+"&argB="+escape(arg2);//要打开的url地址
        xmlHttpRequest.open("get",url,true);//以get方式打开指定的url请求，并且使用的是异步调用方式（true）
        xmlHttpRequest.onreadystatechange=updatePage;//指定回调函数updatePage
        xmlHttpRequest.send(null);//发送请求，由于是get方式，这里用null
    }
   
    //回调函数
    function updatePage()
    {
        if (xmlHttpRequest.readyState==4)
        {
            if (xmlHttpRequest.status==200)
            {
                var response=xmlHttpRequest.responsetext;//回调的内容，以文本的方式返回，当然也可以以xml方式返回(写法为xmlHttpRequest.responseXML)
//                alert(response);//这里返回的不仅有文本，还有诸如.aspx文件中的各种标签
//                var result=response.split(‘<‘)[0];//所以这里要使用split来取文本内容
                var res=response.split(‘<‘);
                var result=res[0];
                document.getElementById ("TextArea1").value=result;
            }
        }
    }
   
    </script>

3，运行结果，同上。。。

三、调用.aspx格式的web窗体（名为Default的web窗体，无需另外创建）

1，点击上面新建的ASP.NET应用程序中Default窗体，在Default.aspx.cs文件中的Page_Load事件中添加如下代码：

protected void Page_Load(object sender, EventArgs e)
        {
            if (Request["argA"]!=null && Request["argB"]!=null)//这个判断一定要加上
            {
                string str1 = Request["argA"].ToString();//获取客户端发送过来的参数的值
                string str2 = Request["argB"].ToString();
                Response.Write("输入的第一个字符串是：" + str1 + "\n输入的第二个字符串是：" + str2);
            }
        }

2，修改Default.aspx文件中的JavaScript脚本如下，这里其实这是对二中的url进行了修改，改变指定的url地址。下面的代码包含了这篇文章中所涉及到的所有的代码，只是这个部分没用到的代码注释起来了，这样也是为了自己方便查看这三个不同的打开方式之间，它们的代码的异同，同时也方便他人。

<script language="javascript" type ="text/javascript" >
    //以下为创建xmlHttpRequest对象
    var xmlHttpRequest=false;
    try
    {
xmlHttpRequest=new XMLHttpRequest();//非IE浏览器
    }
    catch (microsoft)//IE浏览器
    {
        try
        {
            xmlHttpRequest=new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (othermicrosoft)
        {
            try
            {
                xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (failed)
            {
                xmlHttpRequest=false;
            }
        }
    }
   
    if (!xmlHttpRequest)
    {
        alert("不能初始化XMLHttpRequest对象！");
    }
   
    //相应button的Click事件
    function callback()
    {
        var arg1=document.getElementById ("Text1").value;//获取Text1文本框的值
        var arg2=document.getElementById ("Text2").value;//获取Text2文本框的值
        var url="Default.aspx?argA="+escape(arg1)+"&argB="+escape(arg2);//要打开的url地址，并传递两个参数
//        var url="ReturnStr.aspx?argA="+escape(arg1)+"&argB="+escape(arg2);
//        var url="WebService.asmx/getResult?str1="+escape(arg1)+"&str2="+escape(arg2);//要打开的url地址，并传递两个参数，这里参数名必须同webservice提供的参数名一致
        xmlHttpRequest.open("get",url,true);//以get方式打开指定的url请求，并且使用的是异步调用方式（true）
        xmlHttpRequest.onreadystatechange=updatePage;//指定回调函数updatePage
        xmlHttpRequest.send(null);//发送请求，由于是get方式，这里用null
    }
   
    //回调函数
    function updatePage()
    {
        if (xmlHttpRequest.readyState==4)
        {
            if (xmlHttpRequest.status==200)
            {
                var response=xmlHttpRequest.responsetext;//回调的内容，以文本的方式返回，当然也可以以xml方式返回(写法为xmlHttpRequest.responseXML)
//                alert(response);//这里返回的不仅有文本，还有诸如.aspx文件中的各种标签
//                var result=response.split(‘<‘)[0];//所以这里要使用split来取文本内容
                var res=response.split(‘<‘);
                var result=res[0];
                document.getElementById ("TextArea1").value=result;

//                var response=xmlHttpRequest.responseXML;//以xml格式回调内容
//                var result;
//                if (response.evaluate)//XML Parsing in Mozilla
//                {
//                    result=response.evaluate("//text()",response,null,XpathResult.STRING_TYPE,null).stringValue;//Mozilla中获取xml中的文本内容
//                }
//                else
//                {
//                    //XML Parsing in IE
//                    result=response.selectSingleNode("//text()").data;//IE中获取xml中的文本内容
//                }
//                document.getElementById ("TextArea1").value=result;
            }
        }
    }
   
    </script>

3，运行，结果可靠。。。

Ajax打开三种页面的请求

时间： 2024-10-19 05:59:59

Ajax打开三种页面的请求的相关文章

Ajax的三种实现及JSON解析

本文为学习笔记,属新手文章,欢迎指教!! 本文主要是比较三种实现Ajax的方式,为以后的学习开个头. 准备: 1.  prototype.js 2.  jquery1.3.2.min.js 3.  json2.js 后台处理程序(Servlet),访问路径servlet/testAjax: package ajax.servlet; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.Servl

web三种跨域请求数据方法

web三种跨域请求数据方法 以下测试代码使用php,浏览器测试使用IE9,chrome,firefox,safari <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.

（转）JSP三种页面跳转方式的比较

使用JSP大约有下列三种跳转方式: 1. response.sendRedirect(); 2. response.setHeader("Location",""); 3. <jsp:forward page="" /> 经过试验得到下面的一些规则: 一. response.sendRedirect() 此语句前不允许有out.flush(),如果有out.flush(),会有异常: java.lang.IllegalStateExc

Jquery Ajax处理，服务端三种页面aspx,ashx,asmx的比较

常规的Jquery Ajax 验证登录,主要有3种服务端页面相应 ,也就是 aspx,ashx,asmx即webserivice . 下面分别用3种方式来(aspx,ashx,asmx)做服务端来处理 Jquery  Ajax 传过来的用户名和密码验证! 例: Login.html 请求用户名和密码验证! <head> <script type="text/javascript"> $(document).ready(function() { $("#

Ajax的三种数据传输格式

首先说一下什么是Ajax Ajax的全称是Asynchronous JavaScript and XML(是异步的 javascript 和 XML), 通过后台少量的数据交换实现不刷新网页从而进行网页动态的技术,ajax就可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. Ajax能传输的数据格式一共有三种,HTML格式,XML格式,JSON格式 一,HTML格式 使用HTML传输格式,最大特点是要使用DOM方法,获取结点,通过结点进行操作使用inner

ajax 的三种使用方法

第一种 也是最古老的一种方法之一 from 表单直接提交数据到php文件里 action为路径 <form method="post" action="./index.php"> <input name="username" placeholder="用户名" type="text" > <input name="password"placeholder=&

三种页面跳转方式

1.<meta>跳转 <meta http-equiv="refresh" content="5;url=helloword.html"> 5秒后 跳转到helloword.html页面 2.javascript跳转 slef.location='helloword.html://直接跳转 setTimeout("javascript:location.herf='helloword.html',5000");//定时跳转

三种页面置换算法的C++模拟

1 #include<iostream> 2 using namespace std; 3 int page[] = { 7,0,1,2,0,3,0,4,2,3,0,3,2,1,2,0,1,7,0,1,-1 }; 4 void FIFO(); 5 void OPT(); 6 void RLU(); 7 bool inArray(int* a, int n, int p); 8 int main(void) { 9 FIFO(); 10 OPT(); 11 RLU(); 12 system(&q

asp.net跳转页面的三种方法比较

目前,对于学习asp.net的很多朋友来讲,实现跳转页面的方法还不是很了解.本文将为朋友们介绍利用asp.net跳转页面的三种方法,并对其之间的形式进行比较,希望能够对朋友们有所帮助. ASP.NET发展起源 1 ASP.NET的前身ASP技术,是在IIS 2.0上首次推出(Windows NT 3.51),当时与 ADO 1.0 一起推出,在IIS 3.0 (Windows NT 4.0)发扬光大,成为服务器端应用程序的热门开发工具,微软还特别为它量身打造了Visual InterDev开发工