JQuery和AJAX发布到php，而无需在Wordpress中重新加载页面

Question

我正在Wordpress中开发一个插件，并且很难在不重新加载页面的情况下尝试使用Ajax将数据发布到单独的PHP文件中。在后端，PHP文件依靠if( isset() )执行SQL查询。在客户端，用户应该看到各个记录均已淡出，并显示一条消息，指示已成功删除记录。

更新：到目前为止，javascript仍在工作，一旦单击表单按钮，则正确的div -s会淡入淡出。但是，如var_dump所测试，PHP文件未获得任何值。

HTML代码：

<!-- problem: when setting "action" to a url, that page is automatically loaded. I want to stay on the existing page. -->
        <form action='' id='form-delete-assoc' method='post'>
    <input name='remove_all' type='submit' id='remove-all' value='Remove All'></input>
    </form>
JQUERY：

（已通过答复者建议的一些修复程序进行了更新）

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript">
    $(document).ready(function(){
        $('tr.assoc_row').show();
        $('#settings-removed-msg').hide();
        $('#new-assoc-msg').hide();
        $('#formdeleteassoc').submit(function(e){
            e.preventDefault();

            $.ajax ({
                type: 'POST',
                url: '<?php echo $cb_t2c_remove_all_url; ?>',
                data: {removeall: 'yes'
                },
                success: function() {
                    $('#settings-removed-msg').fadeIn('fast');
                    $('tr.assoc_row').fadeOut('fast');
                    }
            });
        });

        $('#formsavesettings').submit(function(){
            $('#new-assoc-msg').fadeIn('fast');
            });
    });
</script>
remove_all.php：

<?php
//remove_all.php

global $wpdb;
$prefix = $wpdb->prefix;

$remove_var_dump = $_POST['removeall']; //returning NULL
var_dump($remove_var_dump);

if ( isset( $_POST['removeall'] ) ){
    $wpdb->query("DELETE FROM ".$prefix."cb_tags2cats");
    }

?>

我正在Wordpress中开发一个插件，并且很难在不重新加载页面的情况下尝试使用Ajax将数据发布到单独的PHP文件中。在后端，PHP文件依赖if（isset（））...

Answer 1

[和其他人一样，您需要return false或使用preventDefault()。您还应该将对fadeOut和fadeIn的调用移到success回调中。如果您不这样做，并且由于某种原因该请求未成功，则可能会误导用户以为它was

Answer 2

您的表单提交事件需要返回false，以阻止表单实际提交。

Answer 3

将数据发布到单独的php页面而不重新加载当前（父页面或首页）页面，创建一个隐藏的iFrame并将其用作提交目标。这种类型的解决方案允许发布和检索json响应。此代码段将文件上传到php页面。