Question

我是一个相当新的网站开发。大多数情况下，我是一名自由艺术家，试图创建自己的网络组合。虽然我认识到学习代码基础知识的重要性，但我正在努力做到这一点。目前，我与一个简单的PHP / HTML联系表格陷入僵局。我的HTML索引上有一些表单（它是一个单页的站点），它在我的PHP文件中调用以将消息发送到我的电子邮件。你可能会认为它看起来像这样：的index.html

  <input name="name" type="text" placeholder="First and last name">


  <input name="email" type="email" id="email" placeholder="Email address">


  <textarea name="message" placeholder="Your Message"></textarea>


  <input id="Submit" class="submit_btn" name="submit" type="submit" value="Submit">

</form>

Contactme.php

 <?php $name = $_POST['name'];
   $email = $_POST['email'];

$message = $_POST['message'];
$from = 'From: mywebsite.com'; 
$to = 'twocoffeespoons@gmail.com'; 
$subject = 'Hello';

$body = "From: $name\n E-Mail: $email\n Message:\n $message";

if ($_POST['submit']) {         
    if (mail ($to, $subject, $body, $from)) { 
  echo '<script language="javascript">';
  echo 'alert("message successfully sent")';
  echo '</script>';
  } else { 
  echo '<p>Something went wrong, go back and stry again!</p>'; 
  } 
}
?>

我想我理解基础知识，但我真的不满意我的表格。当用户点击我的提交按钮时，运行php脚本并将它们带到另一个页面。我知道我可以简单地将我的网站改为index.php，但我不愿意。即使这样，在我发送之后网站仍然会刷新。我一直在查看我能找到的所有内容，但这些教程似乎已经过时了。有人有什么建议吗？我想使用AJAX / JQuery将输入发送到我的php，而用户只是在没有离开我的网站的情况下获得“您的消息已发送警报”。如果我的术语关闭或有点令人困惑，我很抱歉。就像我说的那样，我对此很陌生，过去三天一直试图解决这个问题而没有结果。

Answer 1

尝试这样的事情

$("#ajaxform").submit(function(e)
{
    var postData = $(this).serializeArray();
    var formURL = $(this).attr("action");
    $.ajax(
    {
        url : formURL,
        type: "POST",
        data : postData,
        success:function(data, textStatus, jqXHR)
        {
            //data: return data from server
        },
        error: function(jqXHR, textStatus, errorThrown)
        {
            //if fails     
        }
    });
    e.preventDefault(); //STOP default action
});

HTML CODE

<form id="ajaxform" action="your_url_goes_here">
    .......
</form>

Answer 2

HTML

<input name="name" id="first" type="text" placeholder="First and last name">


  <input name="email" type="email" id="email" placeholder="Email address">


  <textarea id="message" name="message" placeholder="Your Message"></textarea>


  <input id="Submit" class="submit_btn" name="submit" type="submit" value="Submit">
  <span class="error" style="display:none">All Fields Are Required!</span>
  <span class="success" style="display:none">Contact Form Submitted Successfully</span>

脚本

$(function() {
    $(".submit_btn").click(function() {
        var name = $("#first").val();
        var email = $("#email").val();
        var message = $("#message").val();
        var dataString = 'name=' + name + '&email=' + email+ '&message' + message;

        if (name == '' || email == '' || message == '') {
            $('.success').fadeOut(200).hide();
            $('.error').fadeOut(200).show();
        }
        else {
            $.ajax({
                type: "POST",
                url: "Contactme.php",
                data: dataString,
                success: function() {
                    $('.success').fadeIn(200).show();
                    $('.error').fadeOut(200).hide();
                }
            });
        }
        return false;
    });
});

Answer 3

$("#formid").submit(function() {
    // your code
    return false; //return false also works..
});

Answer 4

 - just try this code it will help you , submit your form as method="POST" and action="abc.php";

<?php

if(isset($_POST['submit'])){

$to=$_POST['email'];


$from=$_POST['name'];


$message=$_POST['message'];





$headers = "From:" . $from;
mail($to,$message,$headers);
echo "Mail Sent.";
}
?>

使用不刷新的Jquery / PHP创建联系表单

4 个答案: