ajax（ 汇率转化）

htmhtml:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.9.1.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">
    function Button1_onclick() {
    //创建一个浏览器通用的XMLHTTPRequest对象
    var request = false;
    try 
    {
        request = new XMLHttpRequest();
    }
    catch (trymicrosoft) 
    {
        try {
            request = new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (othermicrosoft) 
        {
            try {
                request = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (failed) 
            {
            request = false;
            }
        }
    }
    if (!request) {
        alert("Error initializing XMLHttpRequest!");
    }
//    else {
//        alert("OK");
//    }
    var amount = document.getElementById("Text1").value;
    var moneytype = document.getElementById("Select1").value;
    request.open("POST", "huilv.ashx?amount="+amount+"&moneytype=" + moneytype+"&ts="+new Date(), true); //准备向服务器的GetDate1.ashx发送请求,最后&ts防止有缓存的，ajax一般不用缓存
            
    //XMLHTTP默认（也推荐）不是同步请求的，也就是open方法并不像webClient的DownloadString那样把服务器返回的数据拿到才返回，是异步的，因此需要监听onreadystatechange事件
    request.onreadystatechange = function () {
        if (request.readyState == 4) {
            if (request.status == 200) {//如果状态是200表示成功
                document.getElementById("Text2").value = request.responseText;//responseText属性为服务器返回的数据       
            }
            else {
                alert("Ajax服务器返回错误！");
            }
        }
    }
    request.send();//这时才开始发送请求
}
//使用jQuery版本ajax
function Button2_onclick() {
    var amount = $("#Text1").val();
    var moneytype = $("#Select1").val();
    //通过jquery的post方法来调用ajax技术  
    //第一个参数是要访问的页面，第二个参数是传递的数据，第三个参数是匿名函数
    $.post("huilv.ashx",{"amount":amount,"moneytype":moneytype}, function (data,textStatus) {
        if (textStatus = "success") {
            $("#Text2").val(data);
        }
        else {
            alert("ajax失败");
        }
    });
    }
    </script>
</head>
<body>
    <input type="text" id="Text1"/>
    <select id="Select1" name="D1">
        <option value="1">美元</option>
        <option value="2">日元</option>
        <option value="3">港币</option>
    </select>
    <input type="button" id="Button1" value="计算" onclick="Button1_onclick()" />
    <input type="button" id="Button2" value="jQuery版Ajax" onclick="Button2_onclick()" />
    <input type="text" id="Text2"/>
</body>
</html>

　　

　　ashx:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace AJax
{
    /// <summary>
    /// huilv 的摘要说明
    /// </summary>
    public class huilv : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            //一个下拉列表（美元，日元，港币），一个按钮，点击按钮在一个span中显示转换后的金额，汇率计算在服务器端完成，假设汇率（人民币/外币）:7  10
            string amount = context.Request["amount"];
            string moneytype = context.Request["moneytype"];
            int iAmount = Convert.ToInt32(amount);
            if (moneytype == "1")//美元
            {
                context.Response.Write(iAmount / 7);
            }
            else if (moneytype=="2")
            {
                context.Response.Write(iAmount * 10);
            }
            else if (moneytype=="3")
            {
                context.Response.Write(iAmount);
            }
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

　　

posted @ 2013-05-05 20:44  蓬莱仙羽  阅读(272)  评论(0)  编辑  收藏  举报