Heim >Web-Frontend >js-Tutorial >Tutorial zur Verwendung von Django Ajax

Tutorial zur Verwendung von Django Ajax

亚连
亚连Original
2018-05-22 13:57:441309Durchsuche

In diesem Artikel wird hauptsächlich das Tutorial zur Verwendung von Django Ajax vorgestellt. Freunde, die es benötigen, können darauf verweisen

Einführung:

AJAX = Asynchrones JavaScript und XML (asynchrones JavaScript und XML).

AJAX ist keine neue Programmiersprache, sondern eine neue Art, bestehende Standards zu nutzen.

AJAX ist die Kunst, Daten mit einem Server auszutauschen und Teile einer Webseite zu aktualisieren, ohne die gesamte Seite neu zu laden.

Ajax

Wenn wir einen Vorgang auf einer Webseite anfordern, müssen wir die Seite oft nicht aktualisieren. Die Technologie zum Erreichen dieser Funktion erfordert Ajax!

Ajax in jQuery kann die Funktion des Anforderns oder Sendens von Daten im Hintergrund realisieren, ohne die Seite zu aktualisieren. Jetzt verwende ich es, um Ajax in Django auszuführen. Je höher die Version, desto besser.

1. Ajax sendet einfache Datentypen:

HTML-Code: Hier senden wir nur eine einfache Zeichenfolge

Ansichten. py

 #coding:utf8
 from django.shortcuts import render,HttpResponse,render_to_response
 def Ajax(request):
   if request.method=='POST':
     print request.POST
     return HttpResponse('执行成功')
   else:
     return render_to_response('app03/ajax.html')

ajax.html

<!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Ajax</title>
 </head>
 <body>
   <input id=&#39;name&#39; type=&#39;text&#39; />
   <input type=&#39;button&#39; value=&#39;点击执行Ajax请求&#39; onclick=&#39;DoAjax()&#39; />
   <script src=&#39;/static/jquery/jquery-3.2.1.js&#39;></script>
   <script type=&#39;text/javascript&#39;>
   function DoAjax(){
     var temp = $(&#39;#name&#39;).val();
     $.ajax({
       url:&#39;app03/ajax/&#39;,
       type:&#39;POST&#39;,
       data:{data:temp},
       success:function(arg){
         console.log(arg);
       },
       error:function(){
         console.log(&#39;failed&#39;)
       }
     });
   }
   </script>
 </html>

Run, das Ergebnis:

2. Ajax sendet komplexe Datentypen:

HTML-Code: Hier wird nur eine Liste gesendet, die den Datentyp „Wörterbuch“ enthält.

Da der gesendete Datentyp im Format eines Listenwörterbuchs vorliegt, müssen wir ihn vorher in eine Zeichenfolgenform konvertieren, andernfalls wird das vom Hintergrundprogramm empfangene Datenformat verwendet nicht der Typ, den wir wollen, daher wird JSON

<!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-">
 <title>Ajax</title>
 </head>
 <body>
   <input id=&#39;name&#39; type=&#39;text&#39; />
   <input type=&#39;button&#39; value=&#39;点击执行Ajax请求&#39; onclick=&#39;DoAjax()&#39; />
   <script src=&#39;/static/jquery/jquery-3.2.1.js&#39;></script>
   <script type=&#39;text/javascript&#39;>
   function DoAjax(){
     var temp = $(&#39;#name&#39;).val();
     $.ajax({
       url:&#39;app03/ajax/&#39;,
       type:&#39;POST&#39;,
       data:{data:temp},
       success:function(arg){
         var obj=jQuery.parseJSON(arg);
         console.log(obj.status);
         console.log(obj.msg);
         console.log(obj.data);
         $(&#39;#name&#39;).val(obj.msg);
       },
       error:function(){
         console.log(&#39;failed&#39;)
       }
     });
   }
   </script>
 </html>

views.py

 #coding:utf
 from django.shortcuts import render,HttpResponse,render_to_response
 import json
 # Create your views here.
 def Ajax(request):
   if request.method==&#39;POST&#39;:
     print request.POST
     data = {&#39;status&#39;:,&#39;msg&#39;:&#39;请求成功&#39;,&#39;data&#39;:[&#39;&#39;,&#39;&#39;,&#39;&#39;]}
     return HttpResponse(json.dumps(data))
   else:
     return render_to_response(&#39;app/ajax.html&#39;)

benötigt, wenn Daten mit Ajax übertragen werden

Druckdatenstil:

Das Obige habe ich für Sie zusammengestellt. Ich hoffe, es wird hilfreich sein Dich in der Zukunft.

Verwandte Artikel:

Ajax arbeitet mit Node JS Multer zusammen, um die Datei-Upload-Funktion zu implementieren

dwz So entfernen Sie Ajaxloading ( Grafik-Tutorial)

Prinzip der domänenübergreifenden Ajax-Anfrage (Bild- und Text-Tutorial)

Das obige ist der detaillierte Inhalt vonTutorial zur Verwendung von Django Ajax. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn