Question

有一个名为post-plain-body的页面模板，用于打印所传递帖子的标题和正文。名为AjaxLoader的页面使用此模板。例如，如果我使用/ajaxloader作为id来调用$_POST['id']，则会显示该帖子的内容。

这是通过主页上的jQuery调用的。它实际上将帖子/页面的内容加载到特定的上下文。

我加载的其中一个页面包含Contact Form 7表单。表单显示但是当我提交时，它会转到/ajaxloader/#wpcf7-f2-p34-o1而不是使用Ajax来验证表单。

这是页面模板。

<?php
/*
Template Name: Ajax Loader
*/

// Load contact form 7 scripts
if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
    wpcf7_enqueue_scripts();
    wpcf7_enqueue_styles();
}

// Gets the content only from a post. Used in ajax loading
if(isset($_POST['id'])):
    $post = get_post($_POST['id']);
    if ($post) : setup_postdata($post); 
        ?>
        <div <?php post_class() ?> id="post-<?php the_ID(); ?>">
            <h2><?php the_title(); ?></h2>
            <?php the_content(); ?>
        </div><?php
    endif;
else:?>
    <h2>Page not found</h2><?php
endif;
?>

正在加载内容的jQuery如下

function load_page(pid) {
    $("#page_preview").load("ajaxloader/", {id:pid},function(){
        $('#page_preview').fadeIn(300);
        $('#page_loading').hide();
    });
}

修改

<form>未附加到Contact Form 7脚本中。我在firebug中使用javascript调试发现了这个。通常，它应该有两个处理程序附加到click和submit事件。有什么建议没有附上吗？

Answer 1

看似contact-form-7在提交时调用load_page()函数。您可能想要检查如何定义调用load_page()的事件处理程序。

contact form 7也可能使用同名load_page()的函数并导致一些冲突。

您应该在jsfiddle上给我们加权版本。

Answer 2

我找到了解决方案。可能对某人来说似乎微不足道，但无论如何我认为我应该分享。

在用于使用Ajax仅加载内容（无标题，侧边栏等）的页面模板上，执行以下操作：

添加wp_head();
添加页面模板（如上面的问题所示）
将wp_footer();添加到底部

如果某人有关于该程序的更多信息，请提供：）

Answer 3

在AjaxComplete上调用它：

var ajaxContainer = $('#somediv_id'),
    newCF7 = $('.wpcf7 > form', ajaxContainer);
    newCF7.attr('action', "#" + newCF7.attr('id'));
    wpcf7.initForm( newCF7 );

Ajaxed加载的内容不会按预期运行

3 个答案: