小编典典

Ajax标签(wordpress)

ajax

因此,我是Ajax的新手,在阅读了一些在线教程之后,以下是我所了解的内容。如果我错了,请纠正我。

现在的情况:

  1. Tab_menu.php:具有选项Tab 1卡,默认情况下,该选项卡在页面加载时显示。对于Tab 2选项卡,menu_tab2.php内容显示在页面加载中。
         <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>
 ```   

  2. menu_tab2.php(其余选项卡的内容与此类似)

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

因此,我想使用ajax将选项卡php文件的内容加载到相应的选项卡中。

**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文件?

谢谢!

**编辑1**

因此,根据提供的答案,这是更新的版本:

**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(data);吗?我不了解结构以及每个组件的含义。


阅读 198

收藏
2020-07-26

共1个答案

小编典典

从$ _GET [‘id’]中检索发布的ID,并将其添加到路径中。

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