打开带外部链接的手风琴


open accordion with external link

我正试图使用外部链接打开手风琴。。实际上,页面上有三个主要的手风琴(关于,结果,联系)

还有一个菜单栏,里面有项目(about、results、contact)。

我想要的是当我点击关于菜单项时,它应该打开关于手风琴

下面是jquery代码

$(function() {
    $( "#accordion" ).accordion({              
        collapsible: true,
        autoHeight: false , 
        active: false,
        navigation:true,       
    }); 
    $(".exlnk").click(function(event){
           window.location.hash=this.hash;
            });         
});

下面是html菜单栏代码:

    <div id="navmenu" style='z-index:9999;'>
      <ul>
        <li><a href="#anchor_about" class="anchor_about">About</a></li>
        <li><a href="#" >Results</a></li>
       <li><a href="#" class ="anchor_contact">Contact</a></li>
      </ul>
    </div>

下面是外部链接的jquery代码

    <script>
     $(document).ready(function(){
     $('a.anchor_about').click(function(){
     $("#accordion").accordion("activate", '<?php echo $_GET['id']; ?>');
 return false;
  });
   });
   </script>

但它不起作用(

有人知道这件事吗?提前感谢

EDIT1

<script>
 $("#navmenu ul").children("li").click(function()
 {
  $("#accordion").accordion("activate", <?php echo (int)$_GET['id']; ?>);
});

EDIT2

下面是手风琴编码

        <div class="demo">                      
            <div id="accordion">                                                       <!--- main accordion 1 demo-->
                <h3><a href="#anchor_home"></a></h3>                            
                    <div id="accordion1" style="margin-bottom:17px;"  >
                        <h1><a href="#" ></a></h1>
                            <div id="content_our_offer" >                              <!--- sub accordion 1 demo-->
                                <?php $page_id=1742;?>                      
                                <?php get_page( $page_id ) ;
                                $page_data = get_page( $page_id );
                                echo '<h3>'. $page_data->post_title .'</h3>';// echo the title
                                echo apply_filters('the_content', $page_data->post_content); ?>              
                            </div>
                    <div style="margin-top:20px;">                                   <!--- sub accordion 2 demo-->
                        <h2  ><a href="#" ></a></h2>    </div>          
                            <div id="content_our_offer" >
                                <?php $page_id=1742;?>                      
                                <?php get_page( $page_id ) ;
                                $page_data = get_page( $page_id );
                                echo '<h3>'. $page_data->post_title .'</h3>';// echo the title
                                echo apply_filters('the_content', $page_data->post_content); ?>              
                            </div>
            </div>

            <div style="margin-top:20px;">
            <h6><a class="exlnk" href="#about" title="About" ></a></h6>   </div>                                              <!--- main accordion 2 demo-->     
                <div id="id_ourresults">
                    <?php
                        $directory = 'our_results'; 
                        try {    
                            // Styling for images
                            foreach ( new DirectoryIterator("../" . $directory) as $item ) {            
                                if ($item->isFile()) {
                                    echo "<div class='"expand_image'">";
                                    $path = "/" . $directory . "/" . $item;
                                    echo "<img src='"" . $path . "'" width=861 height=443  />";
                                    echo "</div>";
                                    }
                                }
                            }
                            catch(Exception $e) {
                            echo 'No images found for this player.<br />';
                            }

       ?>


                </div>          
                <div style="margin-top:20px;">

            <h4><a href="#anchor_contact"></a></h4> </div>                                          <!--- main accordion 3 demo-->
                <div id="id_contactus">      
                    <?php $page_id=1791 ;?>
                    <?php get_page( $page_id ) ;
                    $page_data = get_page( $page_id );
                    echo '<h3>'. $page_data->post_title .'</h3>';// echo the title
                    echo apply_filters('the_content', $page_data->post_content); ?>              
                </div>        
            </div>
    </div><!-- End demo -->
$('a.anchor_about').click(function(){
   $("#accordion").accordion("activate", '<?php echo $_GET['id']; ?>');
   return false;
});

我不认为手风琴激活线上的$_GET['id']会起作用,因为我想你想要这样的

$('a.anchor_about').click(function(){
   var sectionId = $(this).attr("href");
   $("#accordion").accordion("activate", sectionId);
   return false;
});

检查这是否有效-如果有任何错误,请告诉我。

编辑**

此外,我认为要打开手风琴,您需要一个基于index的值,而不是像#someId那样的ID值(这当然适用于tab)。索引是基于零的,因此手风琴的第一部分可以通过传递零值来激活,第二部分可以传递1,依此类推。

根据索引为菜单项命名

<div id="navmenu" style='z-index:9999;'>
    <ul>
        <li><a href="#" name="0">About</a></li>
        <li><a href="#" name="1">Results</a></li>
        <li><a href="#" name="2">Contact</a></li>
    </ul>
</div>

然后根据菜单项中给出的索引激活相应的手风琴项:

$("#navmenu ul").children("li").click(function()
{
    $("#accordion").accordion("activate", $(this).attr("name"));
    // ALSO POSSIBLE (name attribute not needed):
    // Only if the menu items are in the same order as the accordion items
    $("#accordion").accordion("activate", $(this).index());
});

编辑

我只是觉得你的代码在另一个文件中,所以这里有一个选项可以最大限度地减少对代码的更改。当你发送一个散列并在一个新页面中获取ID时。手风琴需要索引号,而不是ID:accordion Methods

<div id="navmenu" style='z-index:9999;'>
    <ul>
        <li><a href="#0">About</a></li>
        <li><a href="#1">Results</a></li>
        <li><a href="#2">Contact</a></li>
    </ul>
</div>
$('#accordion').accordion({"active": $(window.location.hash).index()});