基于URL锚点哈希的Jquery Open Accordion

我有一个FAQ手风琴。 每个问题的类名为q，其id为q1或q2或q3。 每个答案都有一个类名。

当url有一个锚标记/ faq＃q2时，我希望触发q2。 我有下面的代码，但它不工作。

我认为导致它不起作用的行是：if（hash）$（。q [id $ =“+ hash +”]）。trigger（’click’）; 但我无法弄清楚什么是错的。

$(document).ready(function($) { $(".a").hide().first().show(); $(".q:first").addClass("active"); $('#accordion').find('.q').click(function(){ //Expand or collapse this panel $(this).next().slideToggle('fast'); //Hide the other panels $(".a").not($(this).next()).slideUp('fast'); //Find anchor hash and open var hash = $.trim( window.location.hash ); if (hash) $(.q[id$="+hash+"]).trigger('click'); }); }); 

  .q {cursor: pointer;} .a {display: none;} .q.active + .accordion-content { display: block; } 

 
 
Accordion 1
 
 
Cras malesuada ultrices augue Open Accordion 2 molestie risus.
 
 
Accordion 2
 
 
Lorem ipsum dolor sit amet mauris eu turpis.
 
 
Accordion 3
 
 
Vivamus facilisisnibh scelerisque laoreet.
 
  

Answer 1

首先 – 你的jQuery选择器丢失了单引号或双引号。 如果我理解正确 – 你想要这样的东西？

 if (hash) { var element = $(hash); if (element.length) { element.trigger('click'); } } 

更新（ http://jsfiddle.net/6hzby0aa/ ）：

 // Hide all panels $(".a").hide(); // Show first panel by default $(".q:eq(0)").next(".a").show(); // Get hash from query string. You can put there "#q1", "#q2" or something else for test var hash = window.location.hash; if (hash) { // Get panel header element var requestedPanel = $(hash); if (requestedPanel.length) { // Hide all panels $(".a").hide(); // Show requested panel requestedPanel.next(".a").show(); } } 

  
 
Accordion 1
 
 
Cras malesuada ultrices augue Open Accordion 2 molestie risus.
 
 
Accordion 2
 
 
Lorem ipsum dolor sit amet mauris eu turpis.
 
 
Accordion 3
 
 
Vivamus facilisisnibh scelerisque laoreet.
 
  

Answer 2

这是我最后的代码。 感谢@Andrew Orlov