php - jQuery 验证 submitHandler 不适用于 WP AJAX/wp_localize_script

Question

我正在 wp.xml 中实现前端登录表单。并使用 jquery validate 验证表单。使用提交处理程序提交表单。验证和 ajax 工作正常，但主要问题是 wp_localize_script 变量在提交处理程序中不起作用。

这是我的js代码:

var $form = $(this);
jQuery('form#login').validate({
    rules:{
        username: { required: true },
        password: { required: true }
    },
    submitHandler: function(form) {
        jQuery.ajax({
            type: 'POST',
            dataType: 'json',
            url: ajax_login_object.ajaxurl,
            data: { 
                // contains all required values for login
            },
            success: function(data){
              document.location.href = ajax_login_object.redirecturl;
            }
        });
        $form.submit();
    }
});

这是我的 wp 代码:

function ajax_login_init(){
    wp_enqueue_script('script' );
    wp_enqueue_script('js-validate' );
    wp_localize_script( 'ajax-script', 'ajax_login_object', array( 
        'ajaxurl' => admin_url( 'admin-ajax.php' ),
        'redirecturl' => get_site_url().'/page'
    ));
}

这里我没有得到 ajax_login_object 值。建议我实现此错误的地方。

Answer 1

如果你设置了 $ == jQuery 然后坚持下去。另外，您的意思是将 $form 作为您的函数参数还是？

此外，您还在根据什么对脚本进行本地化？ ajax-script 句柄在哪里。

试试

function ajax_login_init(){
    wp_enqueue_script('script' );
    wp_enqueue_script('js-validate' );
    wp_localize_script( 'js-validate', 'ajax_login_object', array( 
        'ajaxurl'     => admin_url( 'admin-ajax.php' ),
        'redirecturl' => get_site_url().'/page'
    ));
}

并查看您的本地化脚本是否在 DOM 中(使用 Chrome 检查它并搜索 ajaxurl 和 redirecturl)。 JS部分:

var $form = $(this);
$('form#login').validate({
    rules:{
        username: { required: true },
        password: { required: true }
    },
    submitHandler: function(form) {
        $.ajax({
            type: 'POST',
            dataType: 'json',
            url: ajax_login_object.ajaxurl,
            data: { 
                // contains all required values for login
            },
            success: function(data){
                form.submit();
                document.location.href = ajax_login_object.redirecturl;
            }
        });
    }
});