Question

我尝试用jquery，ajax和php准备简单的联系表单而不刷新。除了event.preventDefault();

之外，一切正常

那是我的档案：

contact_engine.php

<?php

    $name = $_POST['name'];
    ...


    $from = 'from'; 
    $to = 'to'; 
    $subject = 'subject';
    $human = '4';

    $body = ".........";

    if ($_POST['submit'] && $human == '4') {                 
        if (mail ($to, $subject, $body, $from)) {
            echo '<p>Thanks</p>'; 
        } else { 
        echo '<p>Error</p>'; 
        } 
    } else if ($_POST['submit'] && $human != '4') {
    echo '<p>You answered the anti-spam question incorrectly!</p>';
    }
?>

的Ajax / jQuery的

$('form').on('submit', function(event){
    event.preventDefault();
    $.ajax('.../contact_engine.php', {
        type: 'POST',
        data: $('form').serialize(),
        success: function(result) {
        }
    });
});

PHP

<form method="post" action="<?php bloginfo('template_directory'); ?>/contact_engine.php">       
        <div class="box">
            <input type="text" name="name" class="pola formbg name" placeholder="Name" />
            .
            .
            .
            .

            <p><input id="form-button" type="submit" name="submit" value="Send" /></p>
            </div>
            <br style="clear: left;" />
    </form>

当我删除event.preventDefault();一切正常时，我收到来自表单的消息，但网站很新鲜，我看到了＆＃39;感谢＆＃39;消息。

我使用的是你可能看过的Wordpress。

Answer 1

是的，在这种情况下为什么要有一个表单/提交按钮。删除表单并将提交按钮的输入更改为标准按钮。将功能放在按钮上，完成工作。

$('#form-button').on('click', function(event){

    $.ajax('.../contact_engine.php', {
        type: 'POST',
        data: $('form').serialize(),
        success: function(result) {
           //do something with the return code
        }
    });
});

Answer 2

给你的表单一个ID - 我认为问题是你的提交处理程序没有触发：

$( "#myForm" ).submit(function( event ) {...

然后将您的jQuery更改为：

$( "#myForm" ).submit(function( event ) {
    event.preventDefault();
    ...

请参阅http://api.jquery.com/jquery.post/

Jquery，PHP和Ajax形式没有刷新

2 个答案: