前言
之前写子比的提示框都是写jq代码去处理ajax,最近试了试wp_ajax钩子来实现这个效果。本教程只适用于有些php基础的进阶玩法!
示例代码
function代码(或func.php)
function zib_ajax_notyf(){
// echo zib_send_json_error(array('msg' => '这是一个测试失败提示'));
echo zib_send_json_success(array('msg' => '这是一个测试成功提示'));
wp_die();
}
add_action('wp_ajax_zib_ajax_notyf' , 'zib_ajax_notyf');
执行代码
<div class="box-body text-center">
<a class="but c-blue padding-lg mr10" value="demo_btn" zibajax="submit" form-action="zib_ajax_notyf">点击执行</a>
</div>
代码解释
function中首先创建了个函数 命名一下(不重复即可),子比自带提示的函数 例如zib_send_json_success成功函数,zib_send_json_error失败函数,只需要echo输出一下这个函数并里面传递一个数据即可,之后使用动作钩子挂到wp_ajax_(action)即可,使用示例
add_action( 'wp_ajax_xxxxxxx', 'xxxxxxxxx' );
在页面中写一个按钮并传入action即可,因为子比自带了按钮的class,所以就使用子比的样式,这里使用的a标签创建的按钮。zibajax=”submit”处理ajax,form-action=”动作名”这里与之前的wp_ajax_(action)一致
未登录用户
wp_ajax_(action)这个钩子是处理已登录用户的,如果没登录用户也需要进行处理。这里使用wp_ajax_nopriv_(action)钩子,通常wp_ajax和wp_ajax_nopriv一起使用
ajax处理流程
发送一个ajax请求后处理情况,下面是一个处理示例。同样也是action动作。
jQuery.ajax({
url: ajaxurl,
type: 'POST',
data: {
action: 'zib_ajax_notyf',
},
success: function(response) {
if (response.success) {
console.log(response.data.msg);
} else {
console.error(response.data.msg);
}
}
});
效果图



![表情[ciya]-WordPress主题模板-zibll子比主题](https://www.zibll.com/wp-content/themes/zibll/img/smilies/ciya.gif)





