Question

如何在不重新加载页面的情况下提交表单我知道我必须使用ajax但是我该怎么做？

html文件：

Integer

PHP：

<form name='myform' method="post" action="send.php">
                <span class="close-btn" id="close">&#10006;</span>
                <p>Введите свои контактные данные</p>
                <p>Мы Вам перезвоним</p>
                <input type="text" name="name" placeholder="Имя" maxlength="30">
                <p class="Error" id="Error">Это поле обязательное для заполнения</p>
                <p class="ErrorTwo" id="ErrorTwo">Некорректный ввод</p>
                <input type="tel" name="phone" placeholder="Телефон" maxlength="13">
                <p class="Error" id="telError">Это поле обязательное для заполнения</p>
                <p class="ErrorTwo" id="telErrorTwo">Некорректный ввод</p>
                <input type="submit" value="Отправить заявку"  name="save" id="save" disabled>
                <p>Данные не передаються третьим лицам</p>
            </form>

JS：

/ -----------------------------验证------------- --------------------------- /

<?php 
$ToEmail = 'myemail@gmail.com'; 
$EmailSubject = 'форма обратной связи'; 
$mailheader = "From: ".$_POST["email"]."\r\n";
$MESSAGE_BODY = "Имя: ".$_POST["name"].""; 
$MESSAGE_BODY .= "Телефон: ".$_POST["phone"].""; 
mail($ToEmail, $EmailSubject, $MESSAGE_BODY, $mailheader) or die ("Failure"); 
?>

Answer 1

使用AJAX。我建议您将表单作为JSON加入：在HTML中：

<form name='myForm' onsubmit='event.preventDefault(); sendForm("myForm");'>...</form>

在Js：

   function sendForm(formName){
      var http = new XMLHttpRequest();
      http.open("POST","YourPage.php");
      http.send(JSON.encodeForm(document.forms[formName]));
      http.onreadystatechange = function(){
        if(http.readyState == 4 && http.status == 200){
           console.log(http.responseText); //PHP page's response handling
        }
      }
    }
    JSON.encodeForm = function(form){
      var array = {};
      for (key in form) {
        var item=form[key];
        if(form.hasOwnProperty(key) && item == "[object HTMLInputElement]"){
          array[item.name]=item.value;
        }
      }
      return JSON.stringify(array);
    }

然后，在您的PHP页面中：

$input = json_decode(file_get_contents("php://input") , true);
echo "Saved";

Answer 2

在我看来，更好的选择是验证服务器端文件（some.php）中的数据并将响应返回给客户端文件。

=depth($level) padding-left: 20px + (10px * $level) ul a +depth(0) ul a +depth(1) ul a +depth(2) ul a +depth(3)将如下所示：

php code

你的js文件中的

响应是来自php文件的echo消息。

jsfiddle

编辑（添加了输入掩码信息）：

如果您需要验证客户端文件中的输入，只需使用一些输入掩码库（例如jquery input mask）。这比创建自己的验证脚本更容易。

如何在不重新加载页面的情况下提交表单

2 个答案: