javascript - 提交时，将 html 弹出文件加载到 div 中

Question

我试图在提交到我使用的 HTML 文件时重定向到联系表单。

header('Location: /dev/thanks.html');

但是，这会将它加载到不同的页面，而不是我已经在的页面。

我已经有了 jQuery 来制作联系表单和信息页面的弹出窗口，即:

$('a.contact , a.contact_footer, a.contact_text').click(function() {
    $("html, body").animate({ scrollTop: 0 }, 600);
    $("#popup").load("/dev/contact.php");
    // Getting the variable's value from a link
    var show = $('#popup').css('display', 'block'),
    popup = $(this).attr('href');

    //Fade in the Popup and add close button
    $(popup).fadeIn(300);
    
    // Add the mask to body
    $('body').append('<div id="mask"></div>');
    $('#mask').fadeIn(300);
    
    return false;

在提交联系表单时，我想加载一个新文件 (thanks.html) 以用感谢消息替换弹出窗口(联系表单)。类似于我已经对 jQuery 所做的，但我希望它只在提交时实现:

<div class="submit">
    <input type="submit" value="Submit"/>
</div>

我需要做什么来修改我的 jQuery 以便它在提交时实现而不是在点击时实现？

Answer 1

将提交事件添加到联系表单:

如果您使用 jQuery 1.7+，请使用 on :

$(document).on("submit", "form#submit_message", function() { 
    $('#popup').load('/dev/thanks.html'); 
    return false; 
});

如果没有，使用live (或升级您的 jQuery 版本):

//live is old deprecated
$('form#submit_message').live('submit', function() {
    $('#popup').load('/dev/thanks.html');
    return false;
});