zoukankan      html  css  js  c++  java
  • Ajax案例(使用ajax进行加法运算)

    此案例功能实现了一边看视频一边进行加法运算,而加法运算时页面不会刷新请求

    ajax代码:

    <script type="text/javascript" src="jquery-1.8.3.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btnOK").click(function () {
                var i1 = $("#i1").val();
                var i2 = $("#i2").val();
                var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
                xhr.open("POST", "AjaxTest1.ashx?i1=" + i1 + "&i2=" + i2, true);
                //只有监听onreadystatechange事件来获取返回的进度
                xhr.onreadystatechange = function () {
                    if (xhr.readyState == 4)
                    {
                        //alert();
                        if (xhr.status == 200) {
                            $("#result").text(xhr.responseText);//responseText服务器返回的报文正文
                        }
                        else {
                            alert("服务器出错"+xhr.status);
                        }
                    }
                }
                xhr.send();
            });
        });
    </script>

    html代码:

    <video controls="controls">
        <source src="1.MP4" type="video/mp4" />
    </video>
    <input type="text" id="i1" value="" />+<input type="text" id="i2" value="" />
    <input type="button" id="btnOK" value="=" /><span id="result"></span>

    ashx代码:

    context.Response.ContentType = "text/html";
    int i1 = Convert.ToInt32(context.Request["i1"]);
    int i2 = Convert.ToInt32(context.Request["i2"]);
    int count = i1 + i2;
    Thread.Sleep(2000);
    context.Response.Write(count);

     调用封装的ajax函数写法:

    $(function () {
        $("#btnOK").click(function () {
            var i1 = $("#i1").val();
            var i2 = $("#i2").val();
            MyAjax("AddTest1.ashx?i1=" + i1 + "&i2=" + i2,
            function (resTxt) {
                $("#result").text(resTxt);
            },
            function (status) {
                $("#result").text(status);
            });
        });
    });
  • 相关阅读:
    背包问题
    计蒜客lev3
    线段树BIT操作总结
    图论题收集
    Codeforces Round #607 (Div. 2) 训练总结及A-F题解
    2-sat 学习笔记
    洛谷 P3338 【ZJOI2014】力/BZOJ 3527 力 题解
    $noi.ac$ #51 array 题解
    洛谷 P3292 【SCOI2016】幸运数字/BZOJ 4568 幸运数字 题解
    洛谷 P5283 【十二省联考2019】异或粽子 题解
  • 原文地址:https://www.cnblogs.com/genesis/p/4687543.html
Copyright © 2011-2022 走看看