Ajax选项卡（字preSS） [英] Ajax tabs (wordpress)

问题描述

所以，我很新在阿贾克斯和阅读一些网上的教程后，下面是我的理解。请纠正我，如果我错了。

So, I am very new at Ajax and after reading some online tutorial, below is what I have understood. Please correct me if I am wrong.

现状：

1. Tab_menu.php：有标签其中设置页1 标签是在页面加载默认的显示。对于设置页2 标签， menu_tab2.php 内容显示在页面加载。

1. Tab_menu.php : Has tabs which Tab 1 tab is by default shows on the page load. For the Tab 2 tab, menu_tab2.php content is shown on the page load.

 <div class="my_tabs">
    <a href="#my_tab1" id="my_tab_id_1">Tab 1</a>
    <a href="#my_tab2" id="my_tab_id_2">Tab 2</a>
    <a href="#my_tab3" id="my_tab_id_3">Tab 3</a>
    <a href="#my_tab4" id="my_tab_id_4">Tab 4</a>
    <a href="#my_tab5" id="my_tab_id_5">Tab 5</a>
 </div>
 <div class="my_section" id="my_tab1">
    Tab 1 Content            
 </div>
 <div class="my_section" id="my_tab2">
   <?php get_template_part('page/menu_tab2'); ?>            
 </div>
 <div class="my_section" id="my_tab3">
   <?php get_template_part('page/menu_tab3'); ?>            
 </div>
 <div class="my_section" id="my_tab4">
   <?php get_template_part('page/menu_tab4'); ?>            
 </div>
 <div class="my_section" id="my_tab5">
   <?php get_template_part('page/menu_tab5'); ?>            
 </div>

menu_tab2.php（和类似内容的标签的其余部分）

menu_tab2.php (and similar contents for the rest of the tabs)

 <div class="my_section" id="menu_tab2_content_id">
   Tab 2 content           
 </div>

所以，我要加载的标签PHP文件内容到使​​用ajax的相应选项卡中。

So, I want to load the tab php files content into the corresponding tabs using ajax.

下面是我到目前为止（<一href="http://stackoverflow.com/questions/31331953/execute-php-function-only-when-clicked-word$p$pss/31332113?noredirect=1#comment50652111_31332113">Execute点击只有当PHP函数（字preSS））

Here is what I have so far (Execute php function only when clicked (wordpress))

的jQuery

    $(document).ready(function() {
        $('.my_tabs a').click(function(e) {
            e.preventDefault();

            var tab_id = $('this').attr('id'); 


            $.ajax({
                type: "GET",
                url: "wp-admin/admin-ajax.php", 
                dataType: 'html',
                data: ({ action: 'my_tab_menu', id: tab_id}),
                success: function(data){
                      $('#div'+tab_id).html(data);
            },
            error: function(data)  
            {  
            alert("Error!");
            return false;
            }  

            }); 

     }); 
 }); 

Function.php

 function my_tab_menu() {
   <?php get_template_part('page/tab1'); ?> 
  }

add_action('wp_ajax_my_tab_menu', 'my_tab_menu');
add_action('wp_ajax_nopriv_my_tab_menu', 'my_tab_menu');

问题：

我如何能够针对个人的标签，并相应的PHP文件？

How can I target the individual tab and corresponding php files?

谢谢！

修改1

所以，根据所提供的答案，这里是更新的版本：

So based on the answer provided, here is the updated version:

Function.php

 function my_tab_menu() {
   $template_part_path = 'page/tab' . $_GET['id'];
  <?php get_template_part($template_part_path); ?>  
  }

add_action('wp_ajax_my_tab_menu', 'my_tab_menu');
add_action('wp_ajax_nopriv_my_tab_menu', 'my_tab_menu');

另外，是 $（'＃DIV'+ tab_id）。html的（数据）; 是否正确？我不理解的结构和每个组件的含义。

Also, is $('#div'+tab_id).html(data); correct? I am not understanding the structure and what each component means.

推荐答案

从$ _GET的发布ID ['身份证']，并将其添加到路径。

Retrieve the posted ID from $_GET['id'] and add it to the path.

$template_part_path = 'page/tab' . $_GET['id'];
<?php get_template_part($template_part_path); ?> 

这篇关于Ajax选项卡（字preSS）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！