Question

我正在建立我的第一个网站，我想使用ajax和php实施联系表格，但无法正常工作。这个问题看似愚蠢，但请不要因为成为编程初学者而讨厌我。

你们有什么主意吗？

这是我的HTML代码：

   <div class="col-lg-9 col-md-9 col-xs-12">
          <div class="contact-block">
            <form id="contactForm">
              <div class="row">
                <div class="col-md-6">
                  <div class="form-group">
                    <input type="text" class="form-control" id="name" name="name" placeholder="Ihr Name" required data-error="Bitte geben Sie Ihren Namen ein">
                    <div class="help-block with-errors"></div>
                  </div>                                 
                </div>
                <div class="col-md-6">
                  <div class="form-group">
                    <input type="text" placeholder="Ihre E-Mail" id="email" class="form-control" name="name" required data-error="Bitte geben Sie Ihre E-Mail Adresse ein">
                    <div class="help-block with-errors"></div>
                  </div> 
                </div>
                <div class="col-md-12">
                  <div class="form-group">
                    <input type="text" placeholder="Betreff" id="msg_subject" class="form-control" required data-error="Please enter your subjectBitte fügen Sie einen Betreff hinzu">
                  </div>
                </div>
                <div class="col-md-12">
                  <div class="form-group"> 
                    <textarea class="form-control" id="message" placeholder="Ihre Nachricht" rows="7" data-error="Schreiben Sie eine Nachricht" required></textarea>
                    <div class="help-block with-errors"></div>
                  </div>
                  <div class="submit-button">
                    <button class="btn btn-common btn-effect" id="submit" type="submit">Nachricht senden</button>
                    <div id="msgSubmit" class="h3 hidden"></div> 
                    <div class="clearfix"></div> 
                  </div>
                </div>
              </div>            
            </form>
          </div>
        </div>

这是我的js代码：

    function submitForm(){
// Initiate Variables With Form Content
var name = $("#name").val();
var email = $("#email").val();
var msg_subject = $("#msg_subject").val();
var message = $("#message").val();


$.ajax({
    type: "POST",
    url: "php/form-process.php",
    data: "name=" + name + "&email=" + email + "&msg_subject=" + msg_subject + "&message=" + message,
    success : function(text){
        if (text == "success"){
            formSuccess();
        } else {
            formError();
            submitMSG(false,text);
        }
    }
});}

这是我要在其中发送邮件的php文件：

    <?php
    if($_POST){
    $name = $_POST['name'];
    $email = $_POST['email'];
    $msg_subject = $_POST['msg_subject']
    $message = $_POST['message'];

     //send email
     mail("email@gmail.com", "This is an email from:" .$email, $msg_subject, $message);}?>

如果您需要更多信息，请随时询问。

Answer 1

我在使用带有nodeJs的ajax，但我认为这url: "php/form-process.php",不正确

尝试添加您用于处理类似请求的路由

/form-process.php或/php/form-process.php或您使用的任何路线

如果您还没有将jQuery添加到您的html中

Answer 2

这里可能发生了一些事情。看不见就很难说。您是否已将commitForm（）函数附加到按钮上？

Answer 3

一些可能的原因：

尝试加入jQuery库：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

将您的jQuery代码放入.ready()：

$( document ).ready(function() {
  // Handler for .ready() called.
});

您需要在表单提交事件上调用JS函数SubmitForm（）：

$("#contactForm").on( 'submit', function(){
    submitForm();
    return false;
});

确保存在以下网址：

php/form-process.php

修复您的mail函数参数：

mail ( string $to , string $subject , string $message [, mixed $additional_headers [, string $additional_parameters ]] )

在JS中使用Ajax的联系表格不会发布

3 个答案: