• 用Atlas来实现一个基于AJAX的无刷新Chatroom


    Atlas是微软提供的一个AJAX工具包,封装了实现AJAX的所需的Java Script,使用起来非常简单,可以直接调用Web Service方法,然后通过Asynchronous Call的方式回调给客户端script,我用Atlas写了个简单的基于AJAX的无刷新chatroom:

    Atlas Chatroom
    http://www.worong.com/atlaschat/

    为了引用Web Service,首先要在页面中添加以下客户端脚本:

    <script language="JavaScript" src="ChatService.asmx/js"/>

    用来显示和添加message的调用如下,对于每个方法的调用需要三个参数,分别是:Web Service方法的参数、调用成功后的回调函数、调用超时的回调函数。
     
    function GetMsg() {
        AtlsChat.ChatService.GetConversation(
        
    "",     //params
        OnComplete,     //Complete event
        OnTimeout       //Timeout event
        );
        
        
    return false;
    }


    function Add() {
        document.getElementById('info').innerHTML 
    = '<span style="background-color: yellow">&nbsp;posting&nbsp;</span>';
        AtlsChat.ChatService.Add(
        document.getElementById('inputName').value.replace('\t','
    &nbsp;&nbsp;&nbsp;')+'\t'+ document.getElementById('inputMsg').value.replace('\t','&nbsp;&nbsp;&nbsp;'),
        GetMsg,
        OnTimeout
        );
        
        
    return false;
    }

        
    function OnComplete(result) 
        
    {
            document.getElementById('msg').innerHTML 
    = result;
                
            document.getElementById('info').innerHTML 
    = "";
        }


        
    function OnTimeout(result) 
        
    {
            document.getElementById('info').innerHTML 
    = "time out";
        }


    最后,需要在页面中引用Atlas提供的几个js:

    <atlas:Script ID="Script1" runat="server" Path="~/ScriptLibrary/AtlasCompat.js" Browser="Mozilla" />
        
    <atlas:Script ID="Script2" runat="server" Path="~/ScriptLibrary/AtlasCompat.js" Browser="Firefox" />
        
    <atlas:Script ID="Script3" runat="server" Path="~/ScriptLibrary/AtlasCompat.js" Browser="AppleMAC-Safari" />
        
    <atlas:Script ID="Script4" runat="server" Path="~/ScriptLibrary/AtlasCore.js" />
        
    <atlas:Script ID="Script5" runat="server" Path="~/ScriptLibrary/AtlasCompat2.js" Browser="AppleMAC-Safari" />

     
    <script type="text/xml-script">
            
    <page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
                
    <references>
                    
    <!-- Repath the following src attributes, using regular client relative paths as necessary -->
                    
    <add src="ScriptLibrary/AtlasUI.js" />
                    
    <add src="ScriptLibrary/AtlasControls.js" />
                
    </references>
                
    <components>
                
    </components>
            
    </page>
       
    </script>

    Atlas的官方网站是http://beta.asp.net/default.aspx?tabindex=7&tabid=47,虽然提供了对非IE浏览器的支持,但是在Firefox中更新div会有刷新的感觉,在Mac的Safari上也根本就不work
  • 相关阅读:
    SA练习题总结-篇一
    树上距离(树形DP)
    Codeforces Round #633(Div.2) E. Perfect Triples
    Codeforces Round #633 (Div. 2) D.Edge Weight Assignment
    问题 B: FZB(树形DP+边记忆化)
    【Matlab】自学笔记——基础知识篇
    【Python科学计算】Numpy——ndarry
    退役总结
    [树的遍历]树的遍历(PTA)
    [stl]集合相似度(PTA)
  • 原文地址:https://www.cnblogs.com/roger/p/259600.html
Copyright © 2020-2023  润新知