Question

我通过 jQuery 进行了在线测验，我想在用户提交后，将结果与用户的联系信息一起发送给主持人。

我使其正常运行，正确发送结果信息，问题是它没有发送用户信息。

我一直在玩不同的解决方案，我可以管理或获取用户信息或测验结果，但不能同时使用这两种方法！

这是＆＃34;联系表格＆＃34;：

<form action="submit.php" method="POST" id="form">

<label>Name</label>
<input name="name" placeholder="Type Here">

<label>Email</label>
<input name="email" type="email" placeholder="Type Here">

<label>Message</label>
<textarea name="message" placeholder="Type Here"></textarea>

<input id="button" type="submit" value="Send" class="btnShowResult">

以下是 jQuery 部分，关于ajax发送测验的数据结果，div #resultKeeper是我想要接收的结果

$(function() {
  $('#form').on('submit',function(e) { e.preventDefault();
        $.ajax({
              url:'submit.php',
              type:'POST',
              data:{'results':$('#resultKeeper').html(),'subject':'Subject of your e-mail'},
              success:function() {
$('#responseMessage').html()
              }
        });
        return false;

  });
});

这是我的PHP

<?php $name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$results = $_POST['results'];
$formcontent="From: $name \n Message: $message \n Results: \n $results";
$recipient = "myemail@gmail.com";
$subject = "my subject";
$mailheader = "From: $email \r\n";
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
echo "Your email has been send, thank you";
?>

如果在Jquery中我改变了

$(function() {
  $('#form').on('submit',function(e)

通过#button而不是#form，我从联系表单中收到信息，但不再从结果中收到。

同样通过保留#form，我收到测验的结果，很少有价值作为表格内容，但不是来自占位符的信息！，这是我通过电子邮件收到的信息：

"
From:
 Message:
 Results:
 <div> Question 1 is true</div><div> Question 2 is false\</div><div> Question 3 is true\</div>\<div> Question 4 is false\</div>\<div> Question 5 is false\</div>\<div class=\"totalScore\">\<br>Your total score is 2 / 5\</div>\<div class=\"totalScore\">\<br>CONGRATULATION, YOUR LEVEL IS A1.1\</div
"

正如我们所看到的，我出现了From：和Message：，但没有用户正在编写的正确名称和消息..。

任何帮助都会很可爱!!

这是JSFiddle的allcode：

http://jsfiddle.net/ccwJJ/

Answer 1

当你发出ajax请求时，你的php文件中没有收到你的表单值，你必须在ajax请求中明确地发送它们。

请考虑以下表格

 <form action="submit.php">
    <input type="email" name="email" id="email"/>
    <input type="submit" value="send"/>  
 </form>

案例1 正常方式

当您正常提交表单时，如果点击输入或点击，您将在php文件中隐式收到表单值$_POST['email]变量

 <?php $email = $_POST['email'] ; // valid ?>

案例2 Ajax方式

当您使用ajax提交表单时，由于您的ajax请求不知道您的表单元素，因此您不会在php文件中隐式接收表单值，您必须在ajax请求中显式发送值

  $.post('submit.php',function(result){

          $('#responseMessage').html(result);
    });

   <?php $email = $_POST['email'] // error ?>  
   why? because you have not set the post variable email

然后怎么做？

   var uemail = $("#email").val(); // get the email 
   // Set email and send it through ajax   
   $.post('submit.php',email:uemail,function(result){

          $('#responseMessage').html(result);
    });

   <?php $email = $_POST['email'] // works perfect ?>

现在将表单更改为

 <form action="submit.php" method="POST" id="quesForm">
     <label>Name</label>
     <input name="username" type="text" placeholder="Type Here">
     <label>Email</label>
     <input name="email" type="email" placeholder="Type Here">
     <label>Message</label>
     <textarea name="message" placeholder="Type Here"></textarea>
     <input id="button" type="submit" value="Send" class="btnShowResult">
 </form>

注意我已将name='name'更改为name='username'，我建议您将id=form更改为其他名称id=quesForm。我已经看到，当您使用标记作为ID名称和属性作为属性值时，某些浏览器似乎无法正常工作，就像您已完成name=name和id=form

我建议您使用$.post代替$.ajax，它会在您真正需要时为您简化$.post

<强>的jQuery

$(function() {
   $('#quesForm').on('submit',function(e) { 
    e.preventDefault();
    // I am fetching the form values you could get them by other selectors too
    var uname = $("input[name=username]").val(); 
    var uemail = $("input[name=email]").val();
    var msg = $("textarea").val()
    $.post('submit.php',{username:uname,email:uemail,message:msg,results:$('#resultKeeper').html(),subject:'Subject of your e-mail'},function(result){
          // result variable contains your response text
          // I guess you trying to update your response 
         // notice I have used html(result) as you have just used html()
          $('#responseMessage').html(result);
    });
      // you dont require `return false`
      // you have already did it using e.preventDefault();
  });
});

<强> PHP

<?php $name = $_POST['username'];
       $email = $_POST['email'];
       $message = $_POST['message'];
       $results = $_POST['results'];
       $results = strip_tags($results); // add this to remove html tags and all
       $formcontent="From: $name \n Message: $message \n Results: \n $results";
       $recipient = "thibault.rolando@gmail.com";
       $subject = "my subject";
       $mailheader = "From: $email \r\n";
       mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
       echo "Your email has been send, thank you";
 ?>

要删除php中的html标记，您需要具有名为strip_tags();

的函数

Answer 2

您需要发送表单数据和结果字符串。

尝试以下方法：

$(function() {


  $('#form').on('submit',function(e) { e.preventDefault();
        //grab the form data into array
        var formData = $('#form').serializeArray();
        //add your result and subject
        formData.push({ results:$('#resultKeeper').html(), subject:'Subject of your e-mail'});
        $.ajax({
              url:'submit.php',
              type:'POST',
              data:formData,
              success:function() {
                  $('#responseMessage').html()
              }
    });
    return false;

}）;

Answer 3

最好使用以下方式获取表单输入值：

var data = $('#yourformid').serielize();

您将获得serielize格式的数据并将其放在ajax数据参数上。

使用ajax获取数据获取结果但不提供联系表单

3 个答案: