Question

我有一个ajax函数，需要转换为使用Jquery为wordpress调用 - 但是现在该函数没有被调用？

    function getCategories()
        {

    alert('getCategories test');
            var fData = new Object();
            fData.val = '';

            jQuery(document).ready(
            {
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "php_scripts/getdeals_php.php",
                data: '{"action":"GetCats", "fData":' + JSON.stringify(fData) + '}',
                dataType: "json",
                success: function (msg)
                {
                    alert('Success');
                    var offerList = msg;
                    var Cats = document.getElementById('CategoriesSelect');
                    document.getElementById("CategoriesSelect").options.length = 0;
                    var optn    = document.createElement('option');
                        optn.text   = "Select Category";
                        optn.value  = "Select Category";        
                        Cats.add(optn);


                    for(var i=0;i<offerList.length;i++)
                    {
                        var optn    = document.createElement('option');
                        optn.text   = offerList[i];
                        optn.value  = offerList[i];     
                        Cats.add(optn);
                    }
                },
                error: function (xhr, ajaxOptions, thrownError)
                {
                    alert("ERROR:" + xhr.responseText+" - "+thrownError);
                }
            });

        }

我得到了我的＆＃39; getCategories测试＆＃39;警惕，但我没有取得成功＆＃39;或者错误＆＃39;警报

所以我不认为jquery正在运行。

在我开始将其与wordpress集成之前，我正在使用像这样的ajax

$.ajax({
    type: "POST",
    contentType: "application/json; charset=utf-8",
    url: "php_scripts/getdeals_php.php",
    data: '{"action":"GetCats", "fData":' + JSON.stringify(fData) + '}',
    dataType: "json",
    success: function (msg)
    {
        $('#loadingmessage').hide();
        var offerList = msg;
        var Cats = document.getElementById('CategoriesSelect');
        document.getElementById("CategoriesSelect").options.length = 0;
        var optn    = document.createElement('option');
            optn.text   = "Select Category";
            optn.value  = "Select Category";        
            Cats.add(optn);


        for(var i=0;i<offerList.length;i++)
        {
            var optn    = document.createElement('option');
            optn.text   = offerList[i];
            optn.value  = offerList[i];     
            Cats.add(optn);
        }
    },
    error: function (xhr, ajaxOptions, thrownError)
    {
        alert("ERROR:" + xhr.responseText+" - "+thrownError);
    }
});

我会得到ajax未知的错误，看来我应该使用jquery代替......？

我在控制台中没有错误

Answer 1

嗯，在WP中调用Ajax有一些不同的方法。例如，一种方式就像

FOR JS Piece

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();
    }

    add_action( 'wp_ajax_example_ajax_request', 'example_ajax_request' );

    // If you wanted to also use the function for non-logged in users (in a theme for example)
    // add_action( 'wp_ajax_nopriv_example_ajax_request', 'example_ajax_request' );

感谢wptheming

在你的情况下，首先尝试按照JS部分的模板，然后在WP中记住以防止冲突，你必须始终使用

jQuery(document).ready(function($) {
     // You JS functions 
});

所以我试着动态修改你的代码，希望它适合你。

  jQuery(document).ready(function($) {
    var fData = new Object();
    fData.val = '';
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "php_scripts/getdeals_php.php",
        data: '{"action":"GetCats", "fData":' + JSON.stringify(fData) + '}',
        dataType: "json",
        success: function (msg)
        {
            $('#loadingmessage').hide();
            var offerList = msg;
            var Cats = document.getElementById('CategoriesSelect');
            document.getElementById("CategoriesSelect").options.length = 0;
            var optn    = document.createElement('option');
                optn.text   = "Select Category";
                optn.value  = "Select Category";        
                Cats.add(optn);


            for(var i=0;i<offerList.length;i++)
            {
                var optn    = document.createElement('option');
                optn.text   = offerList[i];
                optn.value  = offerList[i];     
                Cats.add(optn);
            }
        },
        error: function (xhr, ajaxOptions, thrownError)
        {
            alert("ERROR:" + xhr.responseText+" - "+thrownError);
        }
    });
 });

RF：AJAX in Plugins ( WP DOCS )

从ajax切换时没有调用jquery

1 个答案: