Heim  >  Artikel  >  Web-Frontend  >  Analyse zur Verwendung der get-Methode in jQuery

Analyse zur Verwendung der get-Methode in jQuery

高洛峰
高洛峰Original
2016-12-28 14:57:23889Durchsuche

Das Beispiel in diesem Artikel beschreibt die Verwendung der get-Methode in jQuery. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Parameter: URL, [Daten], [Rückruf], [Typ]

Analyse zur Verwendung der get-Methode in jQuery

Fall 1

Formularcode:

<form id="form1" action="#">
<p>评论:</p>
 <p>姓名: <input type="text" name="username" id="username" /></p>
 <p>内容: <textarea name="content" id="content" rows="2" cols="20"></textarea></p>
 <p><input type="button" id="send" value="提交"/></p>
</form>

Ausstehender Div-Code:

<div class=&#39;comment&#39;>已有评论:</div>
<div id="resText" >
</div>

jQuery-Code:

<script type="text/javascript">
//<![CDATA[
 $(function(){
  $("#send").click(function(){
   $.get("get1.php", { 
      username : $("#username").val() , //传入参数
      content : $("#content").val() 
     }, function (data, textStatus){
      $("#resText").html(data); // 把返回的数据添加到页面上
     }
   );
  })
 })
//]]>
</script>

PHP-Code:

<?php 
  header("Content-Type:text/html; charset=utf-8");
  echo "<div class=&#39;comment&#39;><h6>{$_REQUEST[&#39;username&#39;]}:</h6><p class=&#39;para&#39;>{$_REQUEST[&#39;content&#39;]}</p></div>";
?>

Wenn der Benutzer auf die Schaltfläche „Senden“ klickt, wird das Klickereignis ausgelöst und die Daten werden verarbeitet. Übergeben Sie hauptsächlich zwei Parameter, einen ist der Benutzername und der andere ist der Inhalt. Diese beiden Parameter werden an die PHP-Seite übergeben. Nachdem die PHP-Seite verarbeitet wurde, werden die Eingabedaten zurückgegeben und die get-Methode verarbeitet die zurückgegebenen Daten. Bei der Analyse des Codes können wir sehen, dass diese Daten in die resText-div-Ebene geschrieben werden. Die gesamte Prozessseite wird nicht aktualisiert. Die Datenübertragung verlief sehr leise.

Fall 2, Datenverarbeitung im XML-Format

Der Formularcode ist der gleiche wie oben.

Der zu verarbeitende Div-Code ist derselbe wie oben.

jQuery-Code:

<script type="text/javascript">
//<![CDATA[
 $(function(){
  $("#send").click(function(){
   $.get("get2.php", { 
      username : $("#username").val() , 
      content : $("#content").val() 
     }, function (data, textStatus){
      var username = $(data).find("comment").attr("username");
      var content = $(data).find("comment content").text();
      var txtHtml = "<div class=&#39;comment&#39;><h6>"+username+":</h6><p class=&#39;para&#39;>"+content+"</p></div>";
      $("#resText").html(txtHtml); // 把返回的数据添加到页面上
     });
  })
 })
//]]>
</script>

PHP-Code:

<?php 
  header("Content-Type:text/xml; charset=utf-8");
  echo "<?xml version=&#39;1.0&#39; encoding=&#39;utf-8&#39;?>".
     "<comments>".
     "<comment username=&#39;{$_REQUEST[&#39;username&#39;] }&#39; >".
     "<content>{$_REQUEST[&#39;content&#39;]}</content>".
     "</comment>".
     "</comments>";
?>

jQuery-Übergabeparameter sind die gleichen, der Unterschied liegt in der Art und Weise, wie die Rückruffunktion Daten verarbeitet. Aus dem PHP-Code ist ersichtlich, dass die Daten im XML-Format übergeben werden.

jQuery verarbeitet XML genauso wie HTML. Es kann den Wert des Attributs oder den Wert des Knotens abrufen. Nach dem Abrufen dieser Werte kann es bestimmte Verarbeitungen durchführen und zur Seite zurückkehren.

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die sich mit der jQuery-Programmierung befassen.

Weitere Artikel zur Nutzungsanalyse der get-Methode in jQuery finden Sie auf der chinesischen PHP-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