使用Firefox时,AJAX无法正常触发,但在Chrome中可以正常工作

时间:2015-07-13 作者:David Gewirtz

我正在开发一个在Chrome中看起来不错的插件,但并没有在Firefox中通过Ajax启动PHP脚本。这让我分心。以下是与之相关的代码块。

首先,JavaScript排队:

wp_enqueue_script ( \'jquery\' );

$script_url = plugins_url ( \'/js/seamless-donations.js\', __FILE__ );

wp_register_script ( \'seamless_javascript_code\', $script_url, array( \'jquery\' ), false );
wp_enqueue_script ( \'seamless_javascript_code\' );

// declare the URL to the file that handles the AJAX request (wp-admin/admin-ajax.php)
wp_localize_script (
    \'seamless_javascript_code\', \'dgxDonateAjax\',
    array(
        \'ajaxurl\'            => admin_url ( \'admin-ajax.php\' ),
        \'nonce\'              => wp_create_nonce ( \'dgx-donate-nonce\' ),
        \'postalCodeRequired\' => dgx_donate_get_countries_requiring_postal_code ()
    )
);
现在,进行Ajax调用的相关JavaScript:

console.log("-- SeamlessDonationsCheckout: before jQuery.post");
console.log("-- SeamlessDonationsCheckout: ajaxurl=" + dgxDonateAjax.ajaxurl);

jQuery.ajax({
    url: dgxDonateAjax.ajaxurl,
    data: data,
    success: function() {
        console.log("-- SeamlessDonationsCheckout: jQuery.ajax success");
        //response(data);
    }
});

//jQuery.post(dgxDonateAjax.ajaxurl, data, SeamlessDonationsAjaxCallback);
console.log("-- SeamlessDonationsCheckout: after jQuery.post");
数据阵列包括:

var data = {
    action: \'dgx_donate_paypalstd_ajax_checkout\',
    referringUrl: referringUrl,
    nonce: nonce,
    sessionID: sessionID,
    donationAmount: donationAmount,
    (and so on, it\'s a large array)
};
挂钩:

add_action ( \'wp_ajax_dgx_donate_paypalstd_ajax_checkout\', \'dgx_donate_paypalstd_ajax_checkout\' );
add_action ( \'wp_ajax_nopriv_dgx_donate_paypalstd_ajax_checkout\', \'dgx_donate_paypalstd_ajax_checkout\' );
最后是PHP Ajax函数的开头:

function dgx_donate_paypalstd_ajax_checkout () {

// Log
dgx_donate_debug_log ( \'----------------------------------------\' );
dgx_donate_debug_log ( \'DONATION TRANSACTION STARTED\' );
$php_version = phpversion ();
dgx_donate_debug_log ( "PHP Version: $php_version" );
dgx_donate_debug_log ( "Seamless Donations Version: " . dgx_donate_get_version () );
在Chrome中,日志文件清楚地显示函数已被调用,但Firefox中没有任何内容。此外,在Chrome中,浏览器日志显示jQuery前后的日志条目。ajax调用,以及“success”条目,但Firefox没有。

我可以确认已传递Ajax URL的变量,因为以下消息

"-- SeamlessDonationsCheckout: ajaxurl=http://podtrack.com/wp-admin/admin-ajax.php"
显示在Firefox浏览器控制台中。因此,ajax URL并不是没有被传递出去。

我非常感谢您的指导。这件事把我难住了。

谢谢

--大卫

2 个回复
SO网友:jgraup

这是AJAX调用和响应的基础。看一看,确保这对你来说适用于Chrome和Firefox,对我来说也适用。

<?php

// Some function for data we\'ll pass

function dgx_donate_get_countries_requiring_postal_code()
{
    return "cc postal code stuff...";
}

// Register everything

add_action(\'init\', function () {

    // Add required scripts

    wp_enqueue_script(\'jquery\');
    $script_url = plugins_url(\'/js/seamless-donations.js\', __FILE__);

    wp_register_script(\'seamless_javascript_code\', $script_url, array(\'jquery\'), false);
    wp_enqueue_script(\'seamless_javascript_code\');

    // Localize our data 

    wp_localize_script(
        \'seamless_javascript_code\', \'dgxDonateAjax\',
        array(
            \'ajaxurl\' => admin_url(\'admin-ajax.php\'),
            \'nonce\' => wp_create_nonce(\'dgx-donate-nonce\'),
            \'postalCodeRequired\' => dgx_donate_get_countries_requiring_postal_code()
        )
    );

    // Register AJAX handlers

    add_action(\'wp_ajax_dgx_donate_paypalstd_ajax_checkout\', \'dgx_donate_paypalstd_ajax_checkout\');
    add_action(\'wp_ajax_nopriv_dgx_donate_paypalstd_ajax_checkout\', \'dgx_donate_paypalstd_ajax_checkout\');

    // AJAX handler (PRIV / NO PRIV)

    function dgx_donate_paypalstd_ajax_checkout()
    {
        // If we fail don\'t be silent 

        $fail_message = \'\';

        if (empty($_POST[\'nonce\']) || !wp_verify_nonce($_POST[\'nonce\'], \'dgx-donate-nonce\')) $fail_message = \'Bad Nonce\';
        if (empty ($_POST[\'action\'])) $fail_message = \'Missing Action\';
        if ($_POST[\'action\'] !== \'dgx_donate_paypalstd_ajax_checkout\') $fail_message = \'Bad Action\';

        // We failed, let em know...

        if (!empty ($fail_message)) {
            wp_send_json_error(array(
                \'message\' => $fail_message
            )); // die
        }

        // Do logic stuff

        // Send the Success Response

        wp_send_json_success(array(
            \'action\' => $_POST[\'action\'],
            \'message\' => \'Checkout Complete\',
            \'postalCodeRequired\' => $_POST[\'postalCodeRequired\'],
            \'ID\' => 1
        )); // die
    }
});

// Shortcut to trigger AJAX call on page load

add_action(\'wp_footer\', function () { ?>

    <script>

        (function ($) {

            var data = {
                action: \'dgx_donate_paypalstd_ajax_checkout\',
                nonce: dgxDonateAjax.nonce,
                postalCodeRequired: dgxDonateAjax.postalCodeRequired,
            };

            $.ajax({
                type: \'POST\',
                url: dgxDonateAjax.ajaxurl,
                data: data,
                success: function (response) {

                    // look at the response 

                    if (response.success) {

                        // succcess data
                        console.log(response.data);

                    } else {

                        // no good
                        console.log(response);
                    }
                }
            });

        })(jQuery);
    </script>
<?php });

SO网友:voldemortensen

你需要type: \'POST\'在jQuery中。ajax调用。默认值是GET,这需要POST。

因为下面有人要求举例:

jQuery.ajax({
    url: dgxDonateAjax.ajaxurl,
    data: data,
    type: \'POST\',
    success: function() {
        console.log("-- SeamlessDonationsCheckout: jQuery.ajax success");
        //response(data);
    }
});

结束

相关推荐

Add JavaScript to single post

我想在wordpress帖子中添加小javascript程序,请告诉我如何在WP帖子中添加/执行?编辑是的,我试过了,但运气不好。首先,我添加了HTML代码;在Post Text Editor中使用JavaScript,运气不好,然后我创建了单独的JS文件;仅发布HTML代码(&P);使用调用js文件<Script src=<Path of the JS File>> - 没有运气。