Lösung für die Verwendung von jquery zur Implementierung von Ajax basierend auf asp.net

Ob es sich um JQuery oder Ajax handelt, die Diskussion ist heute sehr zurückgeblieben. Es gibt viele Informationen in diesem Bereich im Internet, aber viele Anfänger sind immer noch verwirrt. In diesem Artikel wird die einfachste Methode verwendet, um Anfängern zu demonstrieren, wie sie mit jquery die Ajax-Technologie implementieren (daher ist dieser Artikel speziell für Anfänger geschrieben, Veteranen sollten nicht kritisieren, Experten werden hier 10.000 Wörter weglassen). Was Jquery und Ajax ist, googeln Sie einfach selbst.

Erstellen Sie zunächst eine neue leere asp.net-Webanwendung, die für Ajax bekannt ist. Das Projektverzeichnis ist in der folgenden Abbildung dargestellt.

Die .ashx-Datei ist ein allgemeines Verarbeitungsprogramm. Sie müssen jetzt nicht wissen, wofür sie verwendet wird, Sie werden es später erfahren.

Lassen Sie uns zunächst die Funktionen klären, die wir implementieren möchten: Die WebForm1-Seite sendet jede Sekunde eine Anfrage an den Handler1-Handler, Handler1 gibt Daten an die WebForm1-Seite zurück und die WebForm1-Seite verwendet Ajax-Technologie, um einen teilweisen Aktualisierungseffekt zu erzielen .

Werfen wir zunächst einen Blick auf den Hauptcode von Handler1:

public void ProcessRequest(HttpContext context)
{
    Random rand = new Random();
    int num = rand.Next(1,10);
    context.Response.Write(num);
}

Der Hauptzweck besteht darin, die ProcessRequest-Methode wie oben beschrieben zu ändern und eine zufällige Ganzzahl zwischen 1 und 9 zu generieren Zurück zur Anfrageseite.

Werfen wir einen Blick auf den Hauptcode von WebForm1.aspx:

<script type="text/javascript" src="jQuery/jquery-1.7.1.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        function get() {
            $.ajax({
                type: "Post",
                url: "Handler1.ashx",
                data: "",
                success: function (data) {
                    $("#dataShow").text(data);
                }
            });
        }
        setInterval(get, 1000);
    })
</script>

Wenn wir jquery verwenden möchten, müssen wir die Datei jqury-1.7.1.js zitieren, die wir gerade heruntergeladen haben , wie folgt Der Code sollte verständlich sein, oder? Wenn Sie das nicht verstehen, müssen Sie sich zunächst mit den Grundlagen von js vertraut machen.

Fügen Sie diesen Code auf der Seite hinzu:

<p id="dataShow"></p>

wird verwendet, um die von Request Handler1 zurückgegebenen Daten anzuzeigen.

Es ist vorbei! Das ist alles! Wenn es normal ist, sehen Sie im Browser eine Zahl, die sich zufällig von 1 auf 9 ändert. Beachten Sie, dass hier nicht die gesamte Seite aktualisiert wird! Wenn Sie es nicht glauben, können Sie dem Tag

einen Rand geben, sodass eine Bildlaufleiste angezeigt wird, wenn diese über die Höhe des Browsers hinaus angezeigt wird , es bedeutet eine teilweise Aktualisierung.

Was fortgeschrittenere Funktionen betrifft, müssen die Leser die Informationen selbst überprüfen und recherchieren. Dies ist nur ein einfacher Einführungsartikel.

Weitere verwandte Artikel zu Lösungen für die Verwendung von JQuery zur Implementierung von Ajax unter asp.net finden Sie auf der chinesischen PHP-Website!