PHP 和 Ajax 发布答案

【问题标题】：PHP and Ajax postingPHP 和 Ajax 发布
【发布时间】：2015-05-07 09:47:10
【问题描述】：

我正在使用 jQuery 表单插件来发送 ajax 请求。您可以在下面的网址上找到它

http://malsup.com/jquery/form/

这是我的 jQuery 代码

$(document).ready(function()
{
    $('#SubmitForm').on('submit', function(e)
    {
        e.preventDefault();
        $('#submitButton').attr('disabled', ''); 

        $(this).ajaxSubmit({
        target: '#output',
        success:  afterSuccess //call function after success
        });
    });
});

function afterSuccess()
{   

    $('#submitButton').removeAttr('disabled'); //enable submit button

}

此代码在 div id 输出上显示输出，每次我提交代码时都会删除旧输出并显示新输出。我想要做的是，保留旧输出并将新输出显示在旧输出之上。谁能告诉我该怎么做。

【问题讨论】：

标签： javascript jquery ajax jquery-plugins jquery-forms-plugin

【解决方案1】：

你可以做的是稍微改变你的afterSuccess 方法。我所做的是：

function afterSuccess(text)
{  
    $('#output').prepend(text)
    $('#submitButton').prop('disabled', false);
}

整个小提琴都可用here

整个javascript代码：

function afterSuccess(text)
{  
    $('#output').prepend(text)
    $('#submitButton').prop('disabled', false);
}

$(document).ready(function()
{
    $('#submitButton').click(function(e)
    {
        $('#submitButton').prop('disabled', true);
        $('#SubmitForm').ajaxSubmit({
            data: {
                html: "<p>Text echoed back to request</p>",
                delay: 1
            },
            success:  afterSuccess,
            url: '/echo/html/'
        });
    });
});

当然还有假设以下 html 结构

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/3.51/jquery.form.min.js"></script> 

<body>
    <form id="SubmitForm" method="POST">
        <input type="button" id="submitButton" value="submit"/>
    </form>     
    <div id="output">
        test
    </div>
</body>

【讨论】：

只想问你一件事。输入时如何阻止表单重新加载页面？我试过 preventDefault() 似乎没有成功
这能回答你的问题吗：stackoverflow.com/questions/895171/…
我不会停止输入键。我只是不希望它在按下回车键时刷新页面