以下是完成工作的简单快捷代码:
add_shortcode(\'ajax_login\',\'ajaxlogin_shortcode_handler\');
function ajaxlogin_shortcode_handler($atts,$content=null){
if (is_user_logged_in())
return;
$retval = \'<p id="message" style="color:red"></p>\'
.wp_login_form(array(\'form_id\' => \'ajaxloginform\',\'echo\' => false)).
\'<div id="login-result" style="position:absolute; top:300px; left: 670px;">
<img src="path/ajax-loader.gif"/>
</div>\';
$js = <<<JS
<script type="text/javascript">
jQuery(document).ready(function($){
$("#ajaxloginform").click(function() {
// turn loading screen on
$(\'#login-result\').toggle();
//get foem data
var input_data = $(\'#my-login-form\').serialize();
//make ajax call
$.ajax({
type: "POST",
url: "<?php echo site_url(\'wp-login.php\',\'login_post\'); ?>",
data: input_data,
success: function(msg) {
// if login incorrect, wordpress will redirect user to its own login form. We scan for an error term.
var reg1 = /login_error/g;
if (reg1.test(msg)) {
$(\'#message\').html("<?php _e(\'Your login credentials is not correct. Please try again.\'); ?>");
}else {
// login success. redirect users to some page.
//$(location).attr(\'href\', \'/my-account/\');
//or reload the same page
location.reload();
}
}
});
// turn loading screen off
$(\'#login-result\').toggle();
// prevent actual submission of form
return false;
});
});
</script>
JS;
//enqueue jquery if its not already loaded
wp_enqueue_script(\'jquery\');
return $retval .$js;
}
Usage: [ajax_login]