Heim Web-Frontend js-Tutorial Über die Verwendung von Ajax, Ajax-Datenverarbeitung_AJAX bezogen

Über die Verwendung von Ajax, Ajax-Datenverarbeitung_AJAX bezogen

Jun 28, 2017 pm 01:57 PM
ajax um 数据处理

Der folgende Editor bringt Ihnen einen Artikel über die Verwendung von ajax_examples und die Ajax-Datenverarbeitung. Der Herausgeber findet es ziemlich gut, deshalb teile ich es jetzt mit Ihnen und gebe es als Referenz. Folgen wir dem Editor und werfen wir einen Blick darauf

Es ist zu beachten, dass die gekapselte Datenbank und die jQuery-Speicheradresse aufgerufen werden

1. Registrierung

(1) Schreiben Sie ein Textfeld, um den Benutzernamen zu überprüfen

<input type="text" id="uid" />
<span id="tishi"></span> //这个使用来显示提示信息的
Nach dem Login kopieren


(2) Mit jQuery-Anweisung schreiben: Wenn der Benutzername vorhanden ist, kann er nicht verwendet werden. Der Benutzername kann

$("#uid").blur(function(){
  //取用户名
  var uid = $(this).val();
  //查数据库,调ajax
  $.ajax({  //ajax方法中必须是json格式
  url: "zhucecl.php",  //处理页面的地址
  data:{u:uid},  //这里是Json的格式:u是起的个名字,uid才是值
  type:"POST", //数据提交方式
  dataType:"TEXT",  //返回的数据格式:字符串格式
  success:function(data){  //成功的话返回匿名函数(回调函数)
      //执行处理页面成功后的语句
      var str = "";
                 
      if(data=="OK")
      {
        str = "用户名可以使用";
        $("#tishi").css("color","green");
      }
      else
      {
        str = "已有用户名";  
        $("#tishi").css("color","red");
      }
      $("#tishi").text(str);
      }
      });     
})
Nach dem Login kopieren

verwendet werden. 3) Registrierungsverarbeitungsseite: Ich habe es schon oft geschrieben, daher werde ich es nicht Satz für Satz erklären

<?php
//调封装好的类:注意保存位置
include("DBDA.class.php");
$db = new DBDA();
 
//传的值起的名字
$uid = $_POST["u"];
$sql = "select count(*) from renyuan where username=&#39;{$uid}&#39;";
 
//调用封装的函数
$attr =$db->Query($sql);
 
//判断用户名是否存在
if($attr[0][0]>0)
{
  echo "NO"; //有重复的用户名
}
else
{
  echo "OK";  //没有重复的用户名
}
 
?>
Nach dem Login kopieren

2. Anmelden

(1) Textfeld und Anmeldeschaltfläche eingeben

<p>账号:<input type="text" id="uid" /></p>
<p>密码:<input type="password" id="pwd" /></p>
<input type="button" value="登录" id="btn" />
Nach dem Login kopieren

(2) Schreiben Sie jQuery-Anweisungen

$("#btn").click(function(){
  var uid=$("#uid").val(); //找到用户
  var pwd=$("#pwd").val(); //找到密码
 
  //调ajax方法,里面要用json格式
  $.ajax({
  url:"denglucl.php", //登陆的处理页面
  data:{uid:uid,pwd:pwd}, 
  type:"POST",
  dataType:"text",
  success: function(data)
  {
    if(data.trim()=="OK")
    {
      window.location.href="zhuce.php" rel="external nofollow" ; //用户名密码正确,进入一个页面
    }
    else
    {
      alert("用户名密码输入错误");
    }
  }
  })
       
})
Nach dem Login kopieren

(3) Anmeldeverarbeitungsseite : Ich habe es schon oft geschrieben

<?php
include("DBDA.class.php");
$db = new DBDA();
 
$uid = $_POST["uid"];
$pwd = $_POST["pwd"];
 
$sql = "select mima from huiyuan where yonghu=&#39;{$uid}&#39;";
$attr = $db->Query($sql);
 
if(!empty($pwd) && !empty($attr) && $attr[0][0]==$pwd) //密码不为空,数组不为空,输入密码和查出的密码是否相同
{
  echo "OK";  
}
else
{
  echo "ON";  
}
Nach dem Login kopieren


 

Anmeldung erfolgreich:

3. Ajax-Datenverarbeitung

(1) Zeigen Sie zuerst die Namenszeile an, Bearbeiten Sie es dann normal, wenn Sie es anzeigen möchten. Der Inhalt von

<table width="100%" border="1" cellpadding="0" cellspacing="0">
  <tr>
    <td>代号</td>
    <td>名称</td>
    <td>价格</td>
    <td>产地</td>
    <td>库存</td>
    <td>操作</td>
  </tr>
</table>
Nach dem Login kopieren

(2) Schreiben Sie eine Tabelle das den Inhalt anzeigt

<tbody id="bg">
  //里面放遍历的某个表中的数据内容
</tbody>
Nach dem Login kopieren

(3) Schreiben Sie jQuery und führen Sie es dann aus, nachdem die Seite geladen ist

$(document).ready(function(e) {
  $.ajax({
  url:"xianshicl.php",  
  dataType:"TEXT",
  success: function(data){
    //处理页面处理完成后执行的
       });
Nach dem Login kopieren

(4) Schreiben Anzeigen der Datenverarbeitungsseite (zwei Methoden)

include("DBDA.class.php"); //调用封装好的类:注意存在位置
$db = new DBDA(); //造新对象
   
$sql = "select * from fruit"; //写sql语句
   
echo $db->StrQuery($sql);  //1.调用封装好的拼接数组为字符串的方法
/* //2.
$attr = $db->Query($sql); //调用封装类中的方法来执行sql语句
$str = "";
foreach($attr as $v)
{
  $str .= implode("^",$v)."|"; //拼接数组为字符串
}
       
echo substr($str,0,strlen($str)-1); //截取字符串:最后的拼接符不显示<br>*/
Nach dem Login kopieren

(5) Nach der Verarbeitung Schreiben Sie auf der Seite die Erfolgsmethode in Ajax auf die Hauptseite. Die Anweisung nach der Verarbeitung der Seite

success: function(data){
  var hang = data.split("|"); //拆分字符“|”串:显示行
           
  var str = "";
  for(var i=0;i<hang.length;i++)
  {
  var lie = hang[i].split("^"); //拆分字符串“^”:显示列
  str += "<tr><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td>"+lie[2]+"</td><td>"+lie[3]+"</td><td>"+lie[5]+"</td><td>操作</td></tr>";  //显示的行和单元格
  }
           
  $("#bg").html(str);
}
Nach dem Login kopieren

wird wie folgt angezeigt:

Das obige ist der detaillierte Inhalt vonÜber die Verwendung von Ajax, Ajax-Datenverarbeitung_AJAX bezogen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
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

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌
Will R.E.P.O. Crossplay haben?
1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So beheben Sie den 403-Fehler, der bei einer jQuery-AJAX-Anfrage auftritt So beheben Sie den 403-Fehler, der bei einer jQuery-AJAX-Anfrage auftritt Feb 20, 2024 am 10:07 AM

Titel: Methoden und Codebeispiele zur Behebung von 403-Fehlern in jQuery-AJAX-Anfragen. Der 403-Fehler bezieht sich auf eine Anfrage, dass der Server den Zugriff auf eine Ressource verbietet. Dieser Fehler tritt normalerweise auf, weil der Anfrage die Berechtigungen fehlen oder sie vom Server abgelehnt wird. Wenn Sie jQueryAJAX-Anfragen stellen, stoßen Sie manchmal auf diese Situation. In diesem Artikel wird erläutert, wie dieses Problem gelöst werden kann, und es werden Codebeispiele bereitgestellt. Lösung: Berechtigungen prüfen: Stellen Sie zunächst sicher, dass die angeforderte URL-Adresse korrekt ist und stellen Sie sicher, dass Sie über ausreichende Berechtigungen für den Zugriff auf die Ressource verfügen.

So beheben Sie den Fehler 403 der jQuery AJAX-Anfrage So beheben Sie den Fehler 403 der jQuery AJAX-Anfrage Feb 19, 2024 pm 05:55 PM

jQuery ist eine beliebte JavaScript-Bibliothek zur Vereinfachung der clientseitigen Entwicklung. AJAX ist eine Technologie, die asynchrone Anfragen sendet und mit dem Server interagiert, ohne die gesamte Webseite neu zu laden. Wenn Sie jedoch jQuery zum Senden von AJAX-Anfragen verwenden, treten manchmal 403-Fehler auf. Bei 403-Fehlern handelt es sich in der Regel um vom Server verweigerte Zugriffsfehler, möglicherweise aufgrund von Sicherheitsrichtlinien oder Berechtigungsproblemen. In diesem Artikel besprechen wir, wie Sie bei einer jQueryAJAX-Anfrage den Fehler 403 beheben können

Wie kann das Problem des jQuery AJAX-Fehlers 403 gelöst werden? Wie kann das Problem des jQuery AJAX-Fehlers 403 gelöst werden? Feb 23, 2024 pm 04:27 PM

Wie kann das Problem des jQueryAJAX-Fehlers 403 gelöst werden? Bei der Entwicklung von Webanwendungen wird jQuery häufig zum Senden asynchroner Anfragen verwendet. Allerdings kann bei der Verwendung von jQueryAJAX manchmal der Fehlercode 403 auftreten, der darauf hinweist, dass der Zugriff vom Server verboten ist. Dies wird normalerweise durch serverseitige Sicherheitseinstellungen verursacht, es gibt jedoch Möglichkeiten, das Problem zu beheben. In diesem Artikel wird erläutert, wie Sie das Problem des jQueryAJAX-Fehlers 403 lösen können, und es werden spezifische Codebeispiele bereitgestellt. 1. machen

PHP und Ajax: Erstellen einer Autovervollständigungs-Vorschlags-Engine PHP und Ajax: Erstellen einer Autovervollständigungs-Vorschlags-Engine Jun 02, 2024 pm 08:39 PM

Erstellen Sie eine Engine für Autovervollständigungsvorschläge mit PHP und Ajax: Serverseitiges Skript: Verarbeitet Ajax-Anfragen und gibt Vorschläge zurück (autocomplete.php). Client-Skript: Ajax-Anfrage senden und Vorschläge anzeigen (autocomplete.js). Praktischer Fall: Fügen Sie ein Skript in die HTML-Seite ein und geben Sie die Kennung des Sucheingabeelements an.

Wie erhalte ich Variablen aus der PHP-Methode mit Ajax? Wie erhalte ich Variablen aus der PHP-Methode mit Ajax? Mar 09, 2024 pm 05:36 PM

Die Verwendung von Ajax zum Abrufen von Variablen aus PHP-Methoden ist ein häufiges Szenario in der Webentwicklung. Durch Ajax kann die Seite dynamisch abgerufen werden, ohne dass die Daten aktualisiert werden müssen. In diesem Artikel stellen wir vor, wie man Ajax verwendet, um Variablen aus PHP-Methoden abzurufen, und stellen spezifische Codebeispiele bereit. Zuerst müssen wir eine PHP-Datei schreiben, um die Ajax-Anfrage zu verarbeiten und die erforderlichen Variablen zurückzugeben. Hier ist ein Beispielcode für eine einfache PHP-Datei getData.php:

Wie verbessert Golang die Effizienz der Datenverarbeitung? Wie verbessert Golang die Effizienz der Datenverarbeitung? May 08, 2024 pm 06:03 PM

Golang verbessert die Effizienz der Datenverarbeitung durch Parallelität, effiziente Speicherverwaltung, native Datenstrukturen und umfangreiche Bibliotheken von Drittanbietern. Zu den spezifischen Vorteilen gehören: Parallelverarbeitung: Coroutinen unterstützen die Ausführung mehrerer Aufgaben gleichzeitig. Effiziente Speicherverwaltung: Der Garbage-Collection-Mechanismus verwaltet den Speicher automatisch. Effiziente Datenstrukturen: Datenstrukturen wie Slices, Karten und Kanäle greifen schnell auf Daten zu und verarbeiten sie. Bibliotheken von Drittanbietern: Abdeckung verschiedener Datenverarbeitungsbibliotheken wie fasthttp und x/text.

Verwenden Sie Redis, um die Datenverarbeitungseffizienz von Laravel-Anwendungen zu verbessern Verwenden Sie Redis, um die Datenverarbeitungseffizienz von Laravel-Anwendungen zu verbessern Mar 06, 2024 pm 03:45 PM

Verwenden Sie Redis, um die Datenverarbeitungseffizienz von Laravel-Anwendungen zu verbessern. Mit der kontinuierlichen Entwicklung von Internetanwendungen ist die Datenverarbeitungseffizienz zu einem Schwerpunkt der Entwickler geworden. Bei der Entwicklung von Anwendungen, die auf dem Laravel-Framework basieren, können wir Redis verwenden, um die Effizienz der Datenverarbeitung zu verbessern und einen schnellen Zugriff und ein schnelles Zwischenspeichern von Daten zu erreichen. In diesem Artikel wird die Verwendung von Redis für die Datenverarbeitung in Laravel-Anwendungen vorgestellt und spezifische Codebeispiele bereitgestellt. 1. Einführung in Redis Redis ist ein Hochleistungsspeicher für Daten

Wie vergleichen sich die Datenverarbeitungsfunktionen in Laravel und CodeIgniter? Wie vergleichen sich die Datenverarbeitungsfunktionen in Laravel und CodeIgniter? Jun 01, 2024 pm 01:34 PM

Vergleichen Sie die Datenverarbeitungsfunktionen von Laravel und CodeIgniter: ORM: Laravel verwendet EloquentORM, das eine relationale Klassen-Objekt-Zuordnung bereitstellt, während CodeIgniter ActiveRecord verwendet, um das Datenbankmodell als Unterklasse von PHP-Klassen darzustellen. Abfrage-Builder: Laravel verfügt über eine flexible verkettete Abfrage-API, während der Abfrage-Builder von CodeIgniter einfacher und Array-basiert ist. Datenvalidierung: Laravel bietet eine Validator-Klasse, die benutzerdefinierte Validierungsregeln unterstützt, während CodeIgniter über weniger integrierte Validierungsfunktionen verfügt und eine manuelle Codierung benutzerdefinierter Regeln erfordert. Praxisfall: Beispiel einer Benutzerregistrierung zeigt Lar

See all articles