我知道有很多关于如何防止使用 AJAX 提交表单后重新加载页面的问题和答案,但我就是无法让我的问题和答案工作。我尝试将按钮设置为type:button
,这只会完全禁用该按钮。当我在表单上尝试 onsubmit: return false
时,不会导致单击按钮。使用 jQuery 来防止默认也没有成功。我想要的是使用 PHP 从表单中检索数据来发送此电子邮件,而无需重新加载页面。任何帮助将不胜感激。
表格
<?php include('php/interuni_process.php');?>
<form class="form_pro" action="index.php" method="post" role="form">
<input type="text" class="form" name="E-mail" placeholder="E-mail" value="<?= $email ?>">
<div class="error"><?= $email_error ?></div>
<button name="submit" type="submit" class="action_button"></button>
</form>
PHP
$email_error = "";
$email = "";
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty($_POST["E-mail"])) {
$email_error = "E-mail is required";
} else {
$email = test_input($_POST["E-mail"]);
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$email_error = "Invalid email format";
}
}
if ($email_error == '' ){
unset($_POST['submit']);
$to = " Whoever <$email>";
$subject = 'Hello';
$message = "Hello, $firstname!";
if (mail($to, $subject, $message, $headers)){
$email = '';
}
}
}
function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
我也尝试过
$( document ).ready(function() {
$(".form_pro").submit(function(e) {
e.preventDefault();
$.ajax({
type: "POST",
url: "php/interuni_process.php",
data: $(this).serialize(),
success: function(data) {
},
error: function() {
}
});
});
});
最佳答案
我认为你必须改变逻辑流程才能做到这一点。 尝试以下我在我的电脑上测试过的代码。
<script src="jquery-1.11.1.js"></script>
<form id="myData" class="form_pro" method="post" role="form">
<input type="text" class="form" name="E-mail" placeholder="E-mail" value="">
<div class="error"></div>
<button name="submit" type="button" class="action_button" onclick="doSubmit();">OK</button>
</form>
<script>
function doSubmit(){
$.ajax({
url:'interuni_process.php',
data:$("#myData").serialize(),
type:'POST',
success: function (data, textStatus, jqXHR) {
if(data==="SUCCESS"){
$(".error").text("No error occurred");
}else{
$(".error").text("Error occurred: "+ data);
}
}
});
};
</script>
“interuni_process.php”的示例代码是
<?php
$eMail=$_POST["E-mail"];
if($eMail===""){ //or whatever process condition you want to do
echo "Email cannot be blank";
}else{
echo "SUCCESS";
}
?>
根据需要修改业务逻辑
关于javascript - 尝试阻止页面重新加载时,提交按钮和表单不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43198919/