Comment résoudre le problème de l'erreur de paramètre de données ajax provoquant un crash de page

Cette fois, je vais vous montrer comment résoudre le problème de crash de page causé par une erreur de paramètre de données ajax. Quelles sont les précautions pour résoudre le problème de crash de page causé par une erreur de paramètre de données ajax. est un cas pratique. Jetons un coup d'œil.

Le code est le suivant :

$('.icon-edit').click(function (event) {  这是一个按钮
    o=$('.icon-edit').index($(this))+1;
    edit.style.display='block';
    //console.log('$(this)',$(this).parent().parent());
    let message=$(this).parent().parent();
    $("#non").val(message.children('td:eq(0)').html());
    $("#name").val(message.children('td:eq(1)').html());
    $("#sex").val(message.children('td:eq(2)').html());
    $("#age").val(message.children('td:eq(3)').html());
    $("#xueyuan").val(message.children('td:eq(4)').html());
    $("#grade").val(message.children('td:eq(5)').html());
    $("#phone").val(message.children('td:eq(6)').html());
    $("#room").val(message.children('td:eq(7)').html());
    l=message.children('td:eq(0)').html();
  });
  $('#ok').click(function () {
    //event.stopImmediatePropagation();
    let text=$('table');
    id=$('#non').val();
    username=$('#name').val();
    sex=$('#sex').val();
    age=$('#age').val();
    institute=$('#xueyuan').val();
    grade=$('#grade').val();
    phone=$('#phone').val();
    hlbhl=$('#room').val()
    text.find("tr:eq("+o+")").children('td:eq(0)').text(id);
    text.find("tr:eq("+o+")").children('td:eq(1)').text(username);
    text.find("tr:eq("+o+")").children('td:eq(2)').text(sex);
    text.find("tr:eq("+o+")").children('td:eq(3)').text(age);
    text.find("tr:eq("+o+")").children('td:eq(4)').text(institute);
    text.find("tr:eq("+o+")").children('td:eq(5)').text(grade);
    text.find("tr:eq("+o+")").children('td:eq(6)').text(phone);
    text.find("tr:eq("+o+")").children('td:eq(7)').text(hlbhl);
    $.ajax({
      type: "POST",
      url: "doAction2.php",//请求的后台地址
      data: {
            non:o,
            id: id,
            username: username,
            sex: sex,
            age: age,
            institute: institute,
            grade: grade,
            phone: phone,
            hlbhl: hlbhl
      },//前台传给后台的参数
      dataType: "json",
      ansync: true,
      ContentType: "application/json; charset=utf-8",
      success: function (msg) {//msg:返回值
        a=2;
        console.log(a);
      }
    });
    edit.style.display='none';
  });

L'idée générale du code est que je clique sur un bouton ($('.icon-edit')) puis sur un formulaire (modifier) ​​apparaît. Le formulaire est l'endroit d'où proviennent les données. Cliquez, puis modifiez le contenu du tableau grille
Cliquez sur le bouton OK ($('#ok')) pour écraser. les données du formulaire avec les données de la ligne précédemment cliquée pour atteindre l'objectif de modification du tableau. Lorsque vous cliquez sur OK Déclenchez ajax,
envoyez les données modifiées au backend, récupérez les données et mettez à jour la base de données.

La page de résultats n'a pas signalé d'erreur, mais a planté directement. Après une longue vérification, j'ai découvert que le paramètre data d'ajax était mal écrit. Il était écrit comme ceci auparavant :

    id=text.find("tr:eq("+o+")").children('td:eq(0)').text(id);
    username=text.find("tr:eq("+o+")").children('td:eq(1)').text(username);
    sex=text.find("tr:eq("+o+")").children('td:eq(2)').text(sex);
    age=text.find("tr:eq("+o+")").children('td:eq(3)').text(age);
    institute=text.find("tr:eq("+o+")").children('td:eq(4)').text(institute);
    grade=text.find("tr:eq("+o+")").children('td:eq(5)').text(grade);
    phone=text.find("tr:eq("+o+")").children('td:eq(6)').text(phone);
    hlbhl=text.find("tr:eq("+o+")").children('td:eq(7)').text(hlbhl);
    $.ajax({
      type: "POST",
      url: "doAction2.php",//请求的后台地址
      data: {
            non:o,
            id: id,
            username: username,
            sex: sex,
            age: age,
            institute: institute,
            grade: grade,
            phone: phone,
            hlbhl: hlbhl
      },//前台传给后台的参数
      dataType: "json",
      ansync: true,
      ContentType: "application/json; charset=utf-8",
      success: function (msg) {//msg:返回值
        a=2;
        console.log(a);
      }
    });
    edit.style.display='none';
  });

Comme vous pouvez le voir dans le Out ci-dessus, les données que j'ai transmises à data n'étaient pas une

chaîne ou similaire, mais un n.fn.init [td, prevObject: n.fn.init( 1), contexte : document ], En raison de ma négligence et de ma mauvaise compréhension de la situation qui a provoqué l'erreur ajax, j'ai longuement regardé le code avant d'en découvrir la cause. Je pensais que cela ne serait pas causé par les paramètres,
parce que je pensais que les paramètres n'en étaient pas la cause. L'erreur est que les données obtenues sont fausses, que le rapport est faux ou que les résultats sont différents. Après tout, je le suis toujours aussi. jeune.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser Vux dans un projet Vue

Comment utiliser les slots dans Vue pour distribuer le parent composants

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!