用webserver和javascript实现无刷新效果

最进看了一篇关于ajax的文章,文章的大致意思就是通过javascript中的msxml2的组件对另外一个页面进行操作.通过post或者get的方式传不同的参数来实现不同方法的调用,在以xml的方式将数据传回给当前的页面,使当前页的信息内容得到改变。个人研究了以后觉得这个需要编写者对javascript和xml有深厚的功底才可以完成一般正常的开发。
我觉得通过ms的WebService Behavior一样可以达到ajax的效果,而且开发比较方便。
 
url:http://msdn.microsoft.com/library/default.asp?url=/workshop/author/webservice/webservice.asp

具体实现方法:
Web服务外置XML,将Web服务用作数据源,Web服务传递的内容是XML,将由Web服务返回的XML文档,以便可以将它加载到客户机上的XML分析器。数据访问组件是一个以Web服务形式实现的中间层,提供一个方法检索数据库中的数据,而且通过HTTP以标准的SOAP提供给客户机。

1.webserver服务:
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Diagnostics;
using System.Web;
using System.Web.Services;

namespace localhost
{
    
/// <summary>
    
/// Service2 的摘要说明。
    
/// </summary>

    public class Service2 : System.Web.Services.WebService
    
{
        
public Service2()
        
{
            
//CODEGEN: 该调用是 ASP.NET Web 服务设计器所必需的
            InitializeComponent();
        }


        
#region 组件设计器生成的代码
        
        
//Web 服务设计器所必需的
        private IContainer components = null;
                
        
/// <summary>
        
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
        
/// 此方法的内容。
        
/// </summary>

        private void InitializeComponent()
        
{
        }


        
/// <summary>
        
/// 清理所有正在使用的资源。
        
/// </summary>

        protected override void Dispose( bool disposing )
        
{
            
if(disposing && components != null)
            
{
                components.Dispose();
            }

            
base.Dispose(disposing);        
        }

        
        
#endregion



        [WebMethod]
        
public int add(int a,int b)
        
{
            
return a+b;
        }


        [WebMethod]
        
public string ShwoTime()
        
{
            
return DateTime.Now.ToLongTimeString();
        }

    }

}



  2.表示层:
  (1)使用Web服务行为组件(webservices.htc),将其用于IE中来处理Web服务。关于webservices.htc的介绍及下载可到 http://msdn.microsoft.com/workshop/author/webservice/webservice.asp
<div id="service" style="BEHAVIOR: url(webservice.htc)"></div>

  (2)用javascript声明一个全局变量保存MSXML分析起实例,创建一个myService函数打开Web服务 一旦webservice.htc行为插入页面,就可以使用它来访问Web服务
     
  <body onload="myService()">

<HTML>
    
<head>
        
<script language="javascript">
 
function myService()
 
{
   service.useService("
http://localhost/Service2.asmx?WSDL","svrShwoTime"
); 
   
var iCallID = service.svrShwoTime.callService(myShwoTime,"ShwoTime");
  

 }

  
function myAdd()
  
{
   
var iCallID2 = service.svrShwoTime.callService(Add,"add",Text1.value,Text2.value);
  }

 
function myShwoTime(result)
 
{
   
//显示时间
   displayTime.innerHTML = result.value;
 }
 
  
function Add(result)
 
{
   

   
   Text3.value 
= result.value;
 }
 
 
        
</script>
    
</head>
    
<Body onload="js:setInterval(myService,100);">
     

        <div 
id="displayTime"></div>
        
<FONT face="宋体"></FONT><FONT face="宋体"></FONT>
        
<table width="100%" border="0">
            
<tr>
                
<td style="WIDTH: 335px"><FONT face="宋体"><INPUT id="Text1" style="WIDTH: 160px; HEIGHT: 22px" type="text" size="21" name="Text1">+<INPUT id="Text2" type="text" name="Text2">=</FONT></td>
                
<td><FONT face="宋体"><INPUT id="Text3" type="text" name="Text3"></FONT></td>
            
</tr>
            
<tr>
                
<td style="WIDTH: 335px"><FONT face="宋体"></FONT></td>
                
<td><FONT face="宋体"><INPUT id="Button1" type="button" value="Button" onclick="js:myService1();" name="Button1"></FONT></td>
            
</tr>
        
</table>
        
<div id="service" style="BEHAVIOR: url(webservice.htc)"></div> <!--这是引入javascript库-->
    
</Body>
</HTML>


使用行为的useService方法打开Web Service,通过加载服务器的WSDL文档做到用户能够通过WSDL追加到查询字符串来制定它,同时提供一个“友好名称”,将在代码中使用它来引用Web服务 
  
var iCallID2 = service.svrShwoTime.callService(Add,"add",Text1.value,Text2.value);


指定add方法所需的参数:事件处理程序名,调用的方法名以及此方法的参数.  

 

posted on 2005-07-05 11:05  吴磊  阅读(2483)  评论(2编辑  收藏  举报