À propos de l'utilisation d'Ajax, traitement des données ajax_lié à AJAX

L'éditeur suivant vous proposera un article sur la façon d'utiliser ajax_examples et le traitement des données ajax. L'éditeur le trouve plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence pour tout le monde. Suivons l'éditeur et jetons un coup d'œil

Il est à noter que la base de données encapsulée est appelée et l'adresse de stockage jQuery

1. Inscription<.>

(1) Écrivez une zone de texte pour vérifier le nom d'utilisateur

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

(2) Écrivez avec l'instruction jQuery : le nom d'utilisateur ne peut pas être utilisé s'il existe, mais le nom d'utilisateur peut être utilisé

$("#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);
    　　}
　　　　　　});     
})

( 3) Page de traitement des inscriptions : Je l'ai écrit plusieurs fois, donc je ne vais pas l'expliquer phrase par phrase

<?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";  //没有重复的用户名
}
 
?>

2. Connectez-vous

(1) Écrivez la zone de texte et le bouton de connexion

<p>账号：<input type="text" id="uid" /></p>
<p>密码：<input type="password" id="pwd" /></p>
<input type="button" value="登录" id="btn" />

(2) Écrire des instructions jQuery

$("#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("用户名密码输入错误");
    }
  }
　　})
       
})

(3) Page de traitement de connexion : Je l'ai écrit plusieurs fois. Plus d'explications étape par étape

<?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";  
}

　

Connexion réussie :

3. Traitement des données Ajax

(1) Affichez d'abord la ligne de nom, puis éditez-le normalement, si vous souhaitez l'afficher Le contenu de

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

(2) Écrire un tableau qui affiche le contenu

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

(3) Écrivez jQuery, puis exécutez-le une fois la page chargée

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

(4) Ecrire Afficher la page de traitement des données (deux méthodes)

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>*/

(5) Après traitement la page, écrivez la méthode de réussite en ajax sur la page principale La déclaration après traitement de la page

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);
}

s'affiche comme ceci :

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!