Question

我有一个不属于WordPress的页面，除了我在WordPress库中调用get_header（）和get_footer（）以便将它包装在与其他页面相同的主题中。

然而，在调用get_header（）之后，如果我尝试调用任何类型的AJAX，它就会被忽略。这些块是否只需要在标头标签中添加，还是与WordPress有其他冲突？这是代码：

<?php
require_once( $_SERVER['DOCUMENT_ROOT'].DIRECTORY_SEPARATOR."wp-config.php" );
global $current_user;
get_currentuesrinfo();
get_header();
global $wpdb;
?>

<script type="text/javascript">
<!--
$(function () {
    $('#AdminForm').on('submit', function(e) {
        e.preventDefault();
        $.ajax({
            type: 'post',
            url: 'ajax/save.php',
            data: $('#AdminForm').serialize();
            success: function () {
                alert('form was saved');
                }
            });
        });
    });
//-->
</script>

<form name="AdminForm" id="AdminForm">
<input type="submit" type="submit" value="Save" />
</form>

<?php
get_footer();
?>

我在Chrome开发者工具中发现以下错误：

未捕获的TypeError：$不是函数

是否有正确的方法可以解决与WordPress冲突的问题？

谢谢！

Answer 1

这是由于Wordpress在no-conflict mode中使用jQuery。尝试这样设置：

<script type="text/javascript">
jQuery(function($) {
    $('#AdminForm').on('submit', function(e) {
        e.preventDefault();
        $.ajax({
            type: 'post',
            url: 'ajax/save.php',
            data: $('#AdminForm').serialize();
            success: function() {
                alert('form was saved');
            }
        });
    });
});
</script>

现在，您可以将标准$用于文档就绪功能中的所有功能。

如何在WordPress get_header（）之后将AJAX添加到页面

1 个答案: