PHP和Ajax发布

Question

PHP和Ajax发布

max*_*xlk 2 javascript ajax jquery jquery-plugins jquery-forms-plugin

我正在使用jQuery表单插件发送ajax请求.你可以在下面的网址找到

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

Run Code Online (Sandbox Code Playgroud)

这是我的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

}

Run Code Online (Sandbox Code Playgroud)

这段代码显示在div id输出上,每次我提交的代码都将删除旧的输出并显示新的输出.我想要做的是,保持旧的输出并在旧输出的顶部显示新的输出.有人能告诉我怎么做.

Answer 1

Raf*_*ski 6

你能做什么,是改变你的afterSuccess方法一点点.我做的是:

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

Run Code Online (Sandbox Code Playgroud)

整个小提琴,请点击这里

整个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/'
        });
    });
});

Run Code Online (Sandbox Code Playgroud)

当然假设遵循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>

Run Code Online (Sandbox Code Playgroud)

归档时间：	10 年，5 月前
查看次数：	61 次
最近记录：	10 年，5 月前