本文將詳細介紹Ajax與ASHX的使用，以及如何使用Flush方法實現異步刷新頁面內容。Ajax是一種在不刷新整個頁面的情況下向服務器發送請求并接收響應的技術，ASHX是一種用于處理Ajax請求的處理程序。Flush方法用于將響應中的數據刷新到客戶端瀏覽器。通過結合使用Ajax、ASHX和Flush方法，我們可以實現在不刷新頁面的情況下更新特定部分的內容，提升用戶體驗。
假設我們有一個網頁，其中包含一個列表，用于顯示用戶評論。最初加載頁面時，列表為空。在用戶輸入評論并點擊提交按鈕后，頁面會通過Ajax將評論內容發送到服務器并使用ASHX處理程序處理。在服務器端，ASHX會將評論內容存儲到數據庫中。在完成存儲操作后，ASHX會使用Flush方法向客戶端返回成功信息。客戶端會收到成功的響應，并使用Ajax將新的評論內容添加到列表中，無需刷新整個頁面。
下面是一個使用Ajax和ASHX實現評論功能的示例：
HTML代碼：
<html>
<head>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$("#submit-btn").click(function(){
var comment = $("#comment-input").val();
$.ajax({
url: "comment.ashx",
type: "POST",
data: { comment: comment },
success: function(response){
$("#comment-list").append("<li>" + comment + "</li>");
$("#comment-input").val("");
}
});
});
});
</script>
</head>
<body>
<div id="comment-list">
<ul>
<!-- 通過Ajax動態添加評論列表 -->
</ul>
</div>
<input type="text" id="comment-input" />
<button id="submit-btn">提交</button>
</body>
</html>在上面的示例中，通過jQuery庫發起了一個Ajax請求，將用戶輸入的評論內容作為數據發送到comment.ashx處理程序。成功接收到響應后，會在comment-list中動態添加新的評論。
下面是comment.ashx處理程序的代碼：
ASHX代碼：
<%@ WebHandler Language="C#" Class="CommentHandler" %>
using System;
using System.Web;
using System.Data.SqlClient;
public class CommentHandler : IHttpHandler {
public void ProcessRequest (HttpContext context) {
string comment = context.Request.Form["comment"];
// 將評論存儲到數據庫中
context.Response.ContentType = "text/plain";
context.Response.Write("評論已成功提交");
context.Response.Flush();
}
public bool IsReusable {
get {
return false;
}
}
}在這段代碼中，我們從請求中獲取到了評論內容，然后將其存儲到數據庫中。處理完成后，使用Flush方法將成功消息刷新到客戶端瀏覽器，告知用戶評論已成功提交。
通過以上示例，我們可以看到如何結合使用Ajax、ASHX和Flush方法實現異步刷新頁面內容。這種方式不僅可以提升用戶體驗，還能減少頁面刷新的次數，使頁面加載更快。希望本文能夠對你的學習和開發工作有所幫助。