zoukankan      html  css  js  c++  java
  • Ajax学习(一)

    Ajax技术在当前的web开发领域显得非常热门、使这个称"新瓶装旧酒"的技术一下子成为人门口中的热门词汇!为了不让自己落伍、在繁忙的工作之余、偶也开始学习Ajax...(这里用的是Ajax.Net框架)
    下是一个小例子、来说明Ajax所带来的用户体验!
    1.新建一个项目、添加对Ajax.dll的引用
    2.web.config中设置
    <system.web>
       <httpHandlers>
       <add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
     </httpHandlers>
    .................
    <system.web>
    3.WebForm1.aspx代码如下:(通过js调用服务端方法)

    <HTML>
        
    <HEAD>
            
    <title>Ajax学习(一)</title>
            
    <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
            
    <meta name="CODE_LANGUAGE" Content="C#">
            
    <meta name="vs_defaultClientScript" content="JavaScript">
            
    <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
            
    <script language="javascript">
            
    function ClientAdd()
            
    {
                
    var first=document.all("first");
                
    var second=document.all ("second");
                
    var result=document.all ("result");
                result.value
    =WebForm1.ServerSideAdd(first.value,second.value).value;
                // 调用服务器端方法:类名.方法
            }

            
    </script>
        
    </HEAD>
        
    <body>
            
    <form id="Form1" method="post" runat="server">
                
    <input id="first" type="text" size="5">+<input id="second" type="text" size="5">=<input id="result" type="text" size="5">&nbsp;<input id="calc" type="button" value="计算" onclick="ClientAdd()">
            
    </form>
        
    </body>
    </HTML>


    4.WebForm1.aspx.cs代码如下:

    private void Page_Load(object sender, System.EventArgs e)
            
    {
                Ajax.Utility.RegisterTypeForAjax (
    typeof(WebForm1));
            }


            [Ajax.AjaxMethod ()]
            
    public int ServerSideAdd(int firstNumber,int secondNumber)
            
    {
                
    return firstNumber+secondNumber;
            }

    5.运行界面如:

    在文本框中输入数字后点击"计算按钮",调用服务器端方法获得结果、但是整个页面并没有刷新、只是结果的值发生了改变、
    6.代码下载/Files/chy710/AjaxTest1.rar

  • 相关阅读:
    QR码与DM码的对比
    JBPM在Eclipse中运行时页面错误ProcessEngine cannot be resolved to a type
    C. A Mist of Florescence
    B. A Tide of Riverscape
    A. A Blend of Springtime
    A. Gennady the Dentist
    D. Lizard Era: Beginning
    E. Jzzhu and Apples
    D. Jzzhu and Cities
    C. Jzzhu and Chocolate
  • 原文地址:https://www.cnblogs.com/chy710/p/486382.html
Copyright © 2011-2022 走看看