Question

我真的是从PHP / AJAX / Jquery开始。我尝试了此页面Replacing HTML form with success message after submit, form sends mail using separate php file中的hunijkah代码，并且PHP文件在替换当前页面的空白页面上返回：{"success":true,"errors":[]}。我收到了电子邮件。所以我认为contact.php有效。
我想知道如何取得成功＆＃39;在我的HTML文件中，在成功操作后在当前页面的表格下面写下答案这是表格，我用过：

<form action="contact.php" method="post" id="mail_form">
  <fieldset>
    <legend>Coordonnées personnelles :</legend>
    <p><input class="w3-input w3-padding-16 w3-border" type="text" placeholder="Prénom *" required name="firstname" maxlength="50"></p>
    <p><input class="w3-input w3-padding-16 w3-border" type="text" placeholder="Nom *" required name="lastname" maxlength="50"></p>
    <p><input class="w3-input w3-padding-16 w3-border" type="email" placeholder="Email *" required name="email"></p>
    <p><input class="w3-input w3-padding-16 w3-border" type="tel" placeholder="+681 12 34 56 *" required name="usrtel"></p>
  </fieldset>
  <fieldset>
    <legend>Informations :</legend>
    <p><input class="w3-input w3-padding-16 w3-border" type="number" placeholder="Combien de personne(s) *" required name="people" min="1" max="100"></p>
    <p><input class="w3-input w3-padding-16 w3-border" type="text" placeholder="Message \ Besoins particuliers *" required name="message"></p>
  </fieldset>
  <p>* Champs obligatoires</p>
  <br>
  <div class="g-recaptcha" data-theme="dark" data-sitekey="6LdMKTcUAAAAABNdlU76EOu6W3Wv61T7uKGM9HwB"></div>
  <p>Souhaitez-vous une copie de votre message ? 
  <input type="radio" id="rep_oui" name="copie" value="oui" checked><label for="rep_oui">Oui</label>
  <input type="radio" id="rep_non" name="copie" value="non"><label for="rep_non">Non</label></p>
  <p id="error" class="w3-red w3-xlarge w3-center"></p>
  <p><button class="w3-button w3-light-grey w3-block" type="submit" name="submit">ENVOYER LE MESSAGE</button></p>
  <p><button class="w3-button w3-light-grey w3-block" type="reset">EFFACER</button></p>
</form>

在HTML文件中，我将此脚本放在头标记之间：

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> // 2.1.3 -> 3.2.1

这个脚本位于我的文件底部：

<script>
  $('#mail_form').on('submit', function(event)
  {
    event.preventDefault();
    var dataIn = $(this).serialize(); //serialize turns the form data into a string that can be passed to contact.php. Try doing alert(dataIn); to see what it holds.
    $.post( "./contact.php" , dataIn )
    .done(function( dataOut )
    {
      //dataOut holds the response from contact.php. The response would be any html mail.php outputs. I typically echo out json encoded arrays as responses that you can parse here in the jQuery.
      var finalArray = JASON.parse ( dataOut );
      if ((finalArray['success'] == true) && (finalArray['error1'] == false) && (finalArray['error2'] == false))//Check if it was successfull.
      {  
        $("#mail_form").html("<p class='w3-xxlarge w3-center w3-tag'><strong>Votre message a bien été envoyé !</strong></p>");
      }
      else //there were errors
      {
        if (finalArray['error1'] == true)
        {
          // message not sent
          $('#error').html("<p class='w3-xxlarge w3-center w3-tag'><strong>L'envoi du mail a échoué, veuillez réessayer, s'il vous plaît.</strong></p>");
        }
        else if (finalArray['error2'] == true)
        {
          // one of 7 variables (at least) is empty ...
          $('#error').html("<p class='w3-xxlarge w3-center w3-tag'><strong>Vérifiez que tous les champs soient bien remplis et que l'email soit sans erreur.</strong></p>");
        }
        else
        {
          // recaptcha is false
          $('#error').html("<p class='w3-xxlarge w3-center w3-tag'><strong>Problème d'authentification par le Recaptcha</strong></p>");
        };
      };
    });
      return false; //Make sure you do this or it will submit the form and redirect
  });
</script>

我无法看到自己的错误。这是完全相同的代码，我想知道什么是错的。也许有人可以帮助我，因为过了一天我就撞到了一堵砖墙。我可以在HTML文件中使用测试来确保PHP文件传递成功变量吗？

PS：PHP文件

<?php

    $success = true;
    $error1 = false;
    $error2 = false;

     // ReCAPTCHA
     // grab recaptcha library
     require_once "recaptchalib.php";

     // foreach ($_POST as $key => $value) {
     // echo '<p><strong>' . $key.':</strong> '.$value.'</p>';
     // }

     // your secret key
     $secret = "***_***";

     // empty response
     $response = null;

     // check secret key
     $reCaptcha = new ReCaptcha($secret);

     // if submitted check response
     if ($_POST["g-recaptcha-response"]) {
          $response = $reCaptcha->verifyResponse(
          $_SERVER["REMOTE_ADDR"],
          $_POST["g-recaptcha-response"]
          );
     }

/*
    ********************************************************************************************
    CONFIGURATION
    ********************************************************************************************
*/

// destinataire est votre adresse mail. Pour envoyer à plusieurs à la fois, séparez-les par une virgule
$destinataire = '***@***.**,***@***.**';

// copie ? (envoie une copie au visiteur)
// $copie = 'oui';

// objet du message
$objet = 'Contact depuis le site ***';

// Action du formulaire (si votre page a des paramètres dans l'URL)
// si cette page est index.php?page=contact alors mettez index.php?page=contact
// sinon, laissez vide
$form_action = '';

/*
    ********************************************************************************************
    FIN DE LA CONFIGURATION
    ********************************************************************************************
*/

/*
 * cette fonction sert à nettoyer et enregistrer un texte
 */
function Rec($text)
{
    $text = htmlspecialchars(trim($text), ENT_QUOTES);
    if (1 === get_magic_quotes_gpc())
    {
        $text = stripslashes($text);
    }

    $text = nl2br($text);
    return $text;
};

/*
 * Cette fonction sert à vérifier la syntaxe d'un email
 */
function IsEmail($email)
{
    $value = preg_match('/^(?:[\w\!\#\$\%\&\'\*\+\-\/\=\?\^\`\{\|\}\~]+\.)*[\w\!\#\$\%\&\'\*\+\-\/\=\?\^\`\{\|\}\~]+@(?:(?:(?:[a-zA-Z0-9_](?:[a-zA-Z0-9_\-](?!\.)){0,61}[a-zA-Z0-9_-]?\.)+[a-zA-Z0-9_](?:[a-zA-Z0-9_\-](?!$)){0,61}[a-zA-Z0-9_]?)|(?:\[(?:(?:[01]?\d{1,2}|2[0-4]\d|25[0-5])\.){3}(?:[01]?\d{1,2}|2[0-4]\d|25[0-5])\]))$/', $email);
    return (($value === 0) || ($value === false)) ? false : true;
}


// formulaire envoyé, on récupère tous les champs.
    $firstnameint     = (isset($_POST['firstname']))     ? Rec($_POST['firstname'])        : '';
    $lastnameint      = (isset($_POST['lastname']))      ? Rec($_POST['lastname'])         : '';
    $email            = (isset($_POST['email']))         ? Rec($_POST['email'])            : '';
    $usrtelint        = (isset($_POST['usrtel']))        ? Rec($_POST['usrtel'])           : '';
    $people           = (isset($_POST['people']))        ? Rec($_POST['people'])           : '';
    $messageint       = (isset($_POST['message']))       ? Rec($_POST['message'])          : '';
    $copieint         = (isset($_POST['copie']))         ? Rec($_POST['copie'])            : '';

// traitement du numéro de téléphone et aux variables
    $firstname = htmlspecialchars($firstnameint);
    $lastname = htmlspecialchars($lastnameint);
    $usrtel = htmlspecialchars($usrtelint);
    $message = htmlspecialchars($messageint);
    $copie = htmlspecialchars($copieint);

// traitement du nombre de convives
    $people = sprintf("%d",$_POST['people']); // ici le nombre sera un entier
    $people = abs($people); // $people sera positif ou nul = valeur absolue (évite les âges négatifs !)
    $people = intval($people); // renvoie aussi une valeur entière
    if (is_numeric($people)) // n'effectue que si $people est numérique
    {   
    } else {
        $people='0';
    }
    if ($people >= 1 && $people <= 100) // n'effectue que si $usrtel est borné
    {
    } else {
        $people='0';
    }

// On va vérifier les variables et l'email ...
     $email = (IsEmail($email)) ? $email : ''; // soit l'email est vide si erroné, soit il vaut l'email entré

if (isset($_POST['submit']))
{
    if ($response != null && $response->success)
    {    
        if (($firstname != '') && ($lastname != '') && ($email != '') && ($usrtel != '') && ($people != '') && ($message != '') && ($copie != ''))
        {
            // les 6 variables sont remplies, on génère puis envoie le mail
            $headers  = 'MIME-Version: 1.0' . "\n";
            $headers .= 'From:'.$firstname.' '.$lastname.' <'.$email.'>' . "\n" .
            $headers .= 'Reply-To:'.$email. "\n" .
            $headers .= 'Content-Type: text/html; charset="utf-8"; DelSp="Yes"; format=flowed '."\n" .
            $headers .= 'X-Mailer:PHP/'.phpversion().
            $headers .= 'Content-Transfer-Encoding: 7bit'." \r\n" ;

            // envoyer une copie au visiteur ?
            if ($copie == 'oui')
            {
                $cible = $destinataire.';'.$email;
            }
            else
            {
                $cible = $destinataire;
            };

            // Remplacement de certains caractères spéciaux
            $message = str_replace("&#039;","'",$message);
            $message = str_replace("&#8217;","'",$message);
            $message = str_replace("&quot;",'"',$message);
            $message = str_replace('<br>','',$message);
            $message = str_replace('<br />','',$message);
            $message = str_replace("&lt;","<",$message);
            $message = str_replace("&gt;",">",$message);
            $message = str_replace("&amp;","&",$message);

            // formatage du corps de l'email
            $msg = '<div style="width: 100%; text-align: left; color: #00002b; font-weight: bold"> Message de '.$firstname.' '.
            $lastname.'<br />E-mail : '.$email.' et numéro de téléphone : '.$usrtel.'<br /> nombre de personne(s) : '.$people.
            '<br /> Message : '.$message.'</div>';

            // Envoi du mail
            $num_emails = 0;
            $tmp = explode(';', $cible);          
            foreach($tmp as $email_destinataire)
            {
                if (mail($email_destinataire, $objet, $msg, $headers))
                $num_emails++;
            }

            if ((($copie == 'oui') && ($num_emails == 2)) || (($copie == 'non') && ($num_emails == 1)))
            {
                // message sent
                // Votre message a bien été envoyé !
            }
            else
            {
                // message not sent
                // L'envoi du mail a échoué, veuillez réessayer, s'il vous plaît
                $error1 = true;
            };               
        }
        else
        {
            // one of 7 variables (at least) is empty ...
            // Vérifiez que tous les champs soient bien remplis et que l'email soit sans erreur
            $error2 = true;
        };                
    }
    else
    {
        // recaptcha is false
        // Problème d'authentification par le Recaptcha
        $success = false;
    };
}; // fin du if (!isset($_POST['envoi']))

        $array['success'] = $success;
        $array['error1'] = $error1;
        $array['error2'] = $error2;
        $finalArray=json_encode($array);
        echo $finalArray;
?>

Answer 1

你写的代码缺少a）括号....你必须在浏览器的console.log中看到JSON.parse之后的返回...我附加了缺少括号的代码。 PS：对于Jquery，现在是3.2版本...我建议在当前版本升级而不是继续使用版本2，但这不会影响您的代码。

          $('#mail_form').on('submit', function()
          {
            var dataIn = $(this).serialize(); //serialize turns the form data into a string that can be passed to contact.php. Try doing alert(dataIn); to see what it holds.
            $.post("./contact.php", dataIn )
            .done(function( dataOut )
            {
              //dataOut holds the response from contact.php. The response would be any html mail.php outputs. I typically echo out json encoded arrays as responses that you can parse here in the jQuery.
              var myArray = JSON.parse(dataOut);
              console.log(myArray);
              if (myArray['success'] == true) //Check if it was successfull.
              {
                $("#mail_form").html("Congrats! We just e-mailed you!");
              }
              else //there were errors
              { 
                $('#error').html(""); //Clear error span
                $.each(myArray['errors'], function(i)
                { 
                  $('#error').append(myArray['errors'][i] + "<br>");
                });//------->HERE WAS MISSING A ); 
              };
            });
              return false; //Make sure you do this or it will submit the form and redirect
          });

Hy Falakiko我在这里回答你，因为我举了一个例子，你的错误可能是json数组的错误编码，php发送到客户端javascript我写了我通常做的管理json数据，在一个查询的fecth里面在一个数组$ risultatiArray [] = array（.....）中插入一个“contatore”（1,2,3等等）和存储的行，我用相应的KEYS定义了数组响应json成功，关键记录和关键totaleRisultati是总contatore ..在json_encode响应...添加/ n / r替换为空格但可以是inInfluent。

            while ($sql->fetch()){
                ++$contatore;
                $risultatiArray[] = array('recid'  => trim($contatore),
                                          'rowid' => $id,
                                          'utente' => trim($Utente),
                                          'mese'   => trim($Mese),
                                          'orePermesso' => trim($OrePermesso));

            }
            $response['status'] = 'success';
            $response['records'] = $risultatiArray;
            $response['totaleRisultati'] = $contatore;
            $response = json_encode($response);
            $response = str_replace("\n", "", $response);
            $response = str_replace("\r", "", $response); 
            print $response;

json看起来像这样：

  {"status":"success","records":[{"recid":"1","rowid":9,"utente":"Andrea","mese":"Aprile","orePermesso":"8"},{"recid":"2","rowid":8,"utente":"andrea","mese":"Gennaio","orePermesso":"8"}],"totaleRisultati":2}

所以你的代码使用成功和错误就像一个数组，因为我想从你的代码中错误是一个数组（$。each（myArray ['errors']））可能是：

       $arrayErrori[] = array('1'=>'error1','2'=>'error2');
       $array['succes'] = true;
       $array['errors'] = $arrayErrori;
       $finalArray=json_encode($array);
       print $finalArray;

并且json看起来像这样....但请记住，“true”可以识别为字符串，必须在路上看到...

    {"succes":true,"errors":[{"1":"error1","2":"error2"}]}

好了，现在我看到你的php你的错误是你正在解析一个刚刚在服务器端解析的对象，你的json是正确的。错误在这里：

       var myArray = JSON.parse( dataOut );

dataOut只是在json中你不需要重新分析。所以

            var myArray = dataOut //Don't need to reparse again

ajax调用和php

的示例

        $.ajax({
          type: "POST",
          url: "MNYLINKPHPTOCALL JSON",
          dataType: "JSON",
          data:{},
          success:function(data){   
                console.log(data);  
                console.log(data.success);
                console.log(data.errors);
                console.log(data.errors[0]);
                console.log(data.errors[1]);
          },
          error:function(data){
            alert('Chiamata Fallita');
          }
        });

来自PHP的JSON

$risultatiErrors= array("prova","prova2");      
$output_array['success'] = true;
$output_array['errors'] = $risultatiErrors;
$final = json_encode($output_array);//<---------yOU ARE JUST ENCODING HERE
echo $final;

无法通过AJAX / Jquery在HTML文件中获取PHP变量

1 个答案: