Question

我正在wp中实现前端登录表单。并使用jquery验证验证表单。使用提交处理程序提交表单。运行良好的验证和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;
            }
        });
    }
});

jQuery验证submitHandler无法使用WP AJAX / wp_localize_script

1 个答案: