Question

我创建了一个插件，用于创建名为smm_newsletter的自定义帖子类型，并使用该帖子类型创建简报模板并发送简报电子邮件。然后，我在Post Type的post.new.php / post.php中创建了一个发送按钮的元框。

wp_localize_script的脚本是这个

function smm_admin_scripts() {
    wp_register_script( 'smm-js-priv-script', plugins_url( '/js/private/smm-builder.js', __FILE__ ), array( 'jquery' ), '', true );
    // localize admin URL
    $php_localized_priv_script = array( 'admin_url' => admin_url() );
    wp_localize_script( 'smm-js-priv-script', 'smm_priv_script', $php_localized_priv_script );
    wp_enqueue_script( 'smm-js-priv-script' );
}
add_action( 'admin_enqueue_scripts', 'smm_admin_scripts' );

*我在公共脚本函数中添加了完全相同的本地化管理URL，并且在input提交按钮中工作正常。此代码也可以在input提交按钮中正常工作。

这是该按钮的代码

// I do not use type="submit" because publish/update button use it.
<input id="smm_newsletter_send" name="smm_newsletter_send" type="button" value="Send Newsletter">

和ajax

jQuery( document ).ready( function($) {
    /* Newsletter Section */
    // I did localized script for path to wp-admin here
    var wpajax_url = smm_priv_script.admin_url + 'admin-ajax.php';
    var sendingNewsletter_url = wpajax_url + '?action=smm_newsletter_sender';
    // out put form console: http://localhost/wordpressProject/wordpress/wp-admin/admin-ajax.php?action=smm_newsletter_sender
    console.log(sendingNewsletter_url);
    $( '#smm_newsletter_send' ).on( 'click', function( e ){
        e.preventDefault();
        $form = $( 'form#post' );
        // setup our form data for ajax post
        var form_data = $form.serialize();
        console.log( form_data ); // here it work find
        // submit form data with ajax post
        $.ajax({
            'method' : 'post',
            'url' : sendingNewsletter_url,
            'data' : form_data,
            'dataType' : 'json',
            'catch' : false,
            'success' : function( data, textStatus ){
                if( data.status == 1 ) {
                    // success
                    // notify the user of success
                    window.location.reload( true );
                    console.log( data.status + '\n' );
                    console.log( data.message + '\n' + '——————————' );
                } else {
                    // error
                    // begin building our error message text
                    console.log( data.status + ' ' + 'error' + '\n' );
                    console.log( data.message + '\n' + '——————————' );
                }
            },
            'error' : function( jqXHR, textStatus, errorThrown ) {
                // ajax didn't work
                console.log('A jQuery Ajax error has occurred! See details below...');
                console.log(textStatus);
                console.log(errorThrown);
            }
        });
        // stop the form from submitting nornally
        return false;
    });
});

但是，在我点击该按钮ajax()之后，只为我调整了console.log

undefined error
undefined
——————————

因此，我尝试了另一种方法来测试我的发送简报功能[smm_newsletter_sender()]，以确保该功能有效，方法是将$_POST更改为$_GET。并简单地放置了这个http://localhost/wordpressProject/wordpress/wp-admin/admin-ajax.php?action=smm_newsletter_sender?post_ID=123的网址。通过发送所有通讯电子邮件并返回正确的JSON，它工作得很好。我的电子邮件发送功能工作正常，但发送的按钮没有，为什么？

起初，我怀疑ajax()，我可能做错了吗？但我没有发现任何错误。所以，可能是WordPress本身阻止了我不知道的事情。

Answer 1

看起来你的ajax网址显示未定义。您需要首先本地化您的脚本，如：

wp_register_script（'myscript'，get_stylesheet_directory_uri（）。'/ js / myscript.js'，array（'jquery'），'1.0.1'，TRUE）;

$protocol = !empty($_SERVER['HTTPS']) ? 'https://' : 'http://';

wp_localize_script('myscript', 'ajax_obj', array('admin_ajax' =>admin_url('admin-ajax.php',$protocol)));
// Enqueued script with localized data.
wp_enqueue_script('myscript');

然后在您的.js文件中阅读管理员网址，例如：ajax_obj.admin_ajax。

Answer 2

我曾尝试过很多方法来解决这个问题。好的，我不知道为什么，但这使它成功。首先，我将方法从POST更改为GET，将input按钮更改为a。

这发生在自定义元框中。

// I created nonce url for security thing
$nonce_url = wp_nonce_url( admin_url( 'admin-ajax.php?action=smm_newsletter_sender&post_ID=' . $post->ID ), basename( __FILE__ ), 'smm_send_newsletter_nonce' );
// and changed inupt to a tag
echo( '<div><a href="' . $nonce_url . '" id="smm_newsletter_send" class="button button-primary button-large">Send Newsletter</a>' );

和jQuery ajax()

jQuery( document ).ready( function($) {
    $( '#smm_newsletter_send' ).on( 'click', function( e ){
        $.ajax({
            'method' : 'GET',
            'url' : $( this ).attr( 'href' ),
            'dataType' : 'json',
            'catch' : false,
            'success' : function( data, textStatus ){
                if( data.status == 1 ) {
                    // success
                    // notify the user of success
                    window.location.reload( true );
                    console.log( data.status + '\n' );
                    console.log( data.message + '\n' + '——————————' );
                } else {
                    // error
                    // begin building our error message text
                    console.log( data.status + 'error' + '\n' );
                    console.log( data.message + '\n' + '——————————' );
                }
            },
            'error' : function( jqXHR, textStatus, errorThrown ) {
                // ajax didn't work
                console.log('A jQuery Ajax error has occurred! See details below...');
                console.log(textStatus);
                console.log(errorThrown);
            }

        });
        e.preventDefault();

        // stop the form from submitting nornally
        return false;
    });
});

正如我上面所说，我不知道为什么这项工作，并且在输入按钮的情况下，为什么ajax()无法将请求URL发送到发送操作。所以，这只是一种实用的方式。

如果有人可以解释，请执行此操作。

感谢。

Answer 3

首先，我们只在我们需要的页面上打印脚本。这很重要，因为我们不希望我们的样式/脚本在*p打印。

wp-admin

此外：

在打印脚本之前检查它是否是正确的帖子类型：
本地化完整的admin-ajax网址
本地化安全现时

add_action( 'admin_print_scripts-post.php', 'smm_admin_script');
add_action( 'admin_print_scripts-post-new.php', 'smm_admin_script');

文件function smm_admin_script() { global $typenow; if( 'smm_newsletter' !== $typenow ) return; wp_enqueue_script('my-ajax', plugins_url( '/my-ajax.js', __FILE__ ), array('jquery') ); wp_localize_script( 'my-ajax', 'my_plugin', array( 'ajaxnonce' => wp_create_nonce( 'nonce_smm' ), 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) ); }将使用本地化值my-ajax.js和my_plugin.ajaxnonce。 my_plugin.ajaxurl是在Ajax PHP函数上定义的。

为了进行测试，我使用了action和button#send-ajax。

div#aresponse

Ajax函数检查现时，你做你的事情并返回错误或成功：

jQuery(document).ready(function($) { 
    $( '#send-ajax' ).click( function(e) {
        e.preventDefault();
        var data = {
            action: 'sendform_smm',
            security: my_plugin.ajaxnonce,
            form_smm: { 'input1': 'value1', 'input2': 'value2' }
        };
        /* 
           You can send the full form as an object using:
           form_smm: $form.serializeArray()
        */ 
        $.post( 
            my_plugin.ajaxurl, 
            data,                   
            function( response ){
                // ERROR HANDLING
                if( !response.success ) {
                    // No data came back, maybe a server error
                    if( !response.data )
                        $( '#aresponse' ).html( 'AJAX ERROR: no response' );
                    else
                        $( '#aresponse' ).html( response.data.error );
                }
                else
                    $( '#aresponse' ).html( response.data );
            }
        ); 
    });
});

在post.php上的元框按钮中使用Ajax

3 个答案: