如何制作基于 ajax 的 wordpress 主题选项答案

【问题标题】：how to make wordpress Theme options ajax based如何制作基于 ajax 的 wordpress 主题选项
【发布时间】：2015-07-16 06:46:30
【问题描述】：

如何制作基于 ajax 的 word press 主题选项？在 word-press 中，存储主题选项会刷新页面，我想让它基于 ajax。我面临的问题是，没有 add_option 或 update_option 的代码，我怎样才能使它基于 ajax 谢谢

【问题讨论】：

请告诉我们你到目前为止做了什么。

标签： php wordpress wordpress-theming

【解决方案1】：

你为什么要重新发明轮子？，这有很多东西

您可以在互联网上找到更多信息。但是如果你真的想在你的 ajax 主题选项上做，那么你需要使用wp_ajax_(action)

Javascript：

jQuery(document).ready(function($) {

    // We'll pass this variable to the PHP function example_ajax_request
    var fruit = 'Banana';

    // This does the ajax request
    $.ajax({
        url: ajaxurl,
        data: {
            'action':'example_ajax_request',
            'fruit' : fruit
        },
        success:function(data) {
            // This outputs the result of the ajax request
            console.log(data);
        },
        error: function(errorThrown){
            console.log(errorThrown);
        }
    });   

});

PHP

function example_ajax_request() {

    // The $_REQUEST contains all the data sent via ajax 
    if ( isset($_REQUEST) ) {

        $fruit = $_REQUEST['fruit'];

        // Let's take the data that was sent and do something with it
        if ( $fruit == 'Banana' ) {
            $fruit = 'Apple';
        }

        // Now we'll return it to the javascript function
        // Anything outputted will be returned in the response
        echo $fruit;

        // If you're debugging, it might be useful to see what was sent in the $_REQUEST
        // print_r($_REQUEST);

    }

    // Always die in functions echoing ajax content
   die();
}

更多关于ajax的解释你可以找到here

【讨论】：

$(document).on("submit", "form[action='options.php']", function(event) { var btn = $(document.activeElement); name = btn .attr("name"); if(name == "update") { event.preventDefault(); var settings = $(this).serialize(); $.post( 'options.php', settings ).error ( function() { alert('error'); }).success( function() { alert('选项保存成功'); }); return false; } });

【解决方案2】：

This worked for me 

$(document).on("submit", "form[action='options.php']", function(event) { 
         var btn = $(document.activeElement);
         name =  btn.attr("name");
         if(name == "update")
         {
            event.preventDefault();
            var settings =  $(this).serialize();
            $.post( 'options.php', settings ).error( 
                function() {
                    alert('error');
                }).success( function() {
                    alert('options saved successfully');   
                });
                return false; 
         }
    });

【讨论】：