基于wordpress的ajax写法详解

转载  2018-01-02   作者:myarche   我要评论

下面小编就为大家分享一篇基于wordpress的ajax写法详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

想针对一个wordpress的模板程序进行更改,想到ajax的方便,就研究了一下。

以下是使用方法和代码:

js页面如下

<script>
  var ajaxurl = '<?php echo admin_url('admin-ajax.php')?>';
  function getVideo(id){
		//必须使用以下里面才能正常使用jquery
    jQuery(document).ready(function($){
      var data={
        tape:id,
				//这里尤为重要,action的参数要和请求的函数名一致
        action : 'get_ajax_video',
      }
      $.post(ajaxurl, data, function(response) {
        $('.player').html(response);
      });
    });
  }
</script>

AJAX请求应该指向wp-admin/admin-ajax.php。虽然”admin”这个词有点容易误导人,不过即使是前台的ajax请求,也应该定位到admin-ajax.php。

admin-ajax需要一个参数“action”。admin-ajax需要这个参数来处理请求,它通常触发一个hook,根据是否登录有所不同。

然后在插件或者主题里写函数

function get_ajax_video() {
  // 输出响应
  header( "Content-Type: application/json" );
  echo json_encode($html);
  exit;//这个停止一定要写
}
//函数名对应添加上,第一个表示用户没有登录时,这里全部都一样处理
add_action( 'wp_ajax_nopriv_get_ajax_video', 'get_ajax_video' );
add_action( 'wp_ajax_get_ajax_video', 'get_ajax_video' );

以上这篇基于wordpress的ajax写法详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • react-native 完整实现登录功能的示例代码

    react-native 完整实现登录功能的示例代码

    本篇文章主要介绍了react-native 完整实现登录功能的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-09-09
  • JS获取并操作iframe中元素的方法

    JS获取并操作iframe中元素的方法

    JS获取并操作iframe中元素的方法,需要的朋友可以参考一下
    2013-03-03
  • 第二章之Bootstrap 页面排版样式

    第二章之Bootstrap 页面排版样式

    Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。本文给大家介绍Bootstrap 页面排版样式的相关知识,希望对大家有所帮助!
    2016-04-04
  • Javascript生成全局唯一标识符(GUID,UUID)的方法

    Javascript生成全局唯一标识符(GUID,UUID)的方法

    本文给大家汇总介绍了5种使用javascript实现全局唯一标识符(GUID,UUID)的方法,非常的全面,有需要的小伙伴可以来参考下
    2016-02-02
  • js 只比较时间大小的实例

    js 只比较时间大小的实例

    下面小编就为大家带来一篇js 只比较时间大小的实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-10-10
  • 分享10个优化代码的CSS和JavaScript工具

    分享10个优化代码的CSS和JavaScript工具

    如果你想在保持文件的时候或执 行的阶段lint代码,那么linting工具也可以如你所愿。这取决于个人的选择。如果你正在找寻用于CSS和JavaScript最好的 linting工具,那么请继续阅读
    2016-05-05
  • javascript常用的设计模式

    javascript常用的设计模式

    本文主要介绍了javascript常用的设计模式:单例模式;工厂模式;适配模式;外观模式。下面跟着小编一起来看下吧
    2017-02-02
  • JavaScript Chart 插件整理

    JavaScript Chart 插件整理

    前段时间由于工作关系,查找了一些JS的chart插件,以下数据采集于2010.4.8。
    2010-06-06
  • JS中的回调函数实例浅析

    JS中的回调函数实例浅析

    这篇文章主要介绍了JS中的回调函数,结合实例形式简单分析了javascript回调函数的感念、功能、使用方法及相关注意事项,需要的朋友可以参考下
    2018-03-03
  • js+html5绘制图片到canvas的方法

    js+html5绘制图片到canvas的方法

    这篇文章主要介绍了js+html5绘制图片到canvas的方法,涉及html5元素操作的相关技巧,需要的朋友可以参考下
    2015-06-06

最新评论