Question

我有一个网页，我正在使用.ajax将变量发送到php脚本。 php页面正在加载到浏览器中，就好像我正在浏览它一样。该脚本正在正确加载数据，因此我的问题是停止导航并将用户保留在原始页面上。我的表单代码在这里：

echo "<form method='post' action='addTask.php' id='myform'>\n";
echo "<input name='addtask' id='addtask' maxlength='64'/><br/>\n";
echo "<input type='submit' name='submit' id='submit' value='Add Task'/>\n";
echo "</form>\n";

我的jquery的代码在这里：

    $(function(){
    $('#myform').submit(function(e){
        e.stopPropagation();
        $.ajax({
            url: 'addTask.php',
            type: 'POST',
            data: {},
            success: alert("Success")
            });
        });
    });

我试过：e.preventDefault（），e.stopPropagation（）并返回false。任何帮助表示赞赏。

        $("#submit").click(function(e){
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "addtask.php",
            data: { }
        })
        .done(function() {
            alert( "success" );
        })
        .fail(function() {
            alert( "error" );
        });

和

$(function(){
    $('#myform').submit(function(e){
        e.preventDefault();
        $.ajax({
            url: 'addTask.php',
            type: 'POST',
            data: {},
            success: function(){alert("Success")}
        });
    });
});

Answer 1

通过在ajax调用之后返回false，我成功阻止了表单提交。

$(function () {
    $('#myform').submit(function (e) {
        $.ajax({
            url: 'addTask.php',
            type: 'POST',
            data: {},
            success: alert("Success")
        });
        return false;
    });
});

http://jsfiddle.net/5c3n2/

编辑：

上面的代码演示了return false如何阻止表单提交。但是，正如gloomy.penguin所提到的，success应该是一个函数。此外，由于调用永远不会在jsFiddle上成功，我添加了complete。

$(function () {
    $('#myform').submit(function (e) {
        $.ajax({
            url: 'addTask.php',
            type: 'POST',
            data: {},
            success: function() {alert("Success");},
            complete: function() {alert("Completed");}
        });
        return false;
    });
});

http://jsfiddle.net/5c3n2/2/

Answer 2

尝试阻止提交按钮的默认设置：

$('input#submit').click(function(e){
    e.preventDefault();
    //submit your form
});

AJAX提交到PHP仍然在preventDefault（）之后加载页面

2 个答案:

编辑：