2012年12月11日

AJax Loading 

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="Pages_test" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script type="text/javascript" src="<%=Page.ResolveUrl("~/") %>js/jquery-1.8.3.min.js"></script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <img id="img1" src="<%=Page.ResolveUrl("~/") %>images/ajax-loader.gif" /><input id="btn1" type="button" value="Click" /><br />
        <img id="img2" src="<%=Page.ResolveUrl("~/") %>images/ajax-loader.gif" /><input id="btn2" type="button" value="Click" /><br />
        <img id="img3" src="<%=Page.ResolveUrl("~/") %>images/ajax-loader.gif" /><input id="btn3" type="button" value="Click" /><br />
    </div>
    </form>
</body>
</html>

$(function () {
        $('img').hide();
        $('img').hide();

        $('#btn1').click(function () {
            $('#img1').show();
            $.ajax({
                url: "/mjib/Services/CaseManageServices.ashx",
                type: 'POST',
                cache: false,
                data: {
                    OperationType: 'test'
                },
                success: function (response) {
                    $('#img1').hide();
                },
                error: function (response) {
                    $('#img1').hide();
                }
            });
        });

        $('#btn2').click(function () {
            $('#img2').show();
            $.ajax({
                url: "/mjib/Services/CaseManageServices.ashx",
                type: 'POST',
                cache: false,
                data: {
                    OperationType: 'test'
                },
                success: function (response) {
                    $('#img2').hide();
                },
                error: function (response) {
                    $('#img2').hide();
                }
            });
        });

        $('#btn3').click(function () {
            $('#img3').show();
            $.ajax({
                url: "/mjib/Services/CaseManageServices.ashx",
                type: 'POST',
                cache: false,
                data: {
                    OperationType: 'test'
                },
                success: function (response) {
                    $('#img3').hide();
                },
                error: function (response) {
                    $('#img3').hide();
                }
            });
        });
    });
</script>
張貼者： 於
標籤：

沒有留言:

張貼留言