0

I have a couple of divs of questions for an faq. The faq was coded in a way that the active panel for a question expands when clicked but the first question opens by default. Now I want to make each panel to have its unique URL when clicked.

<div class="row faq_links">
   <h1 class="faq-header">Frequently Asked Questions</h1>

<div id="accordion" class="faq-column">

      <div id="faq1" class="panel tabcontent">
        <p class="header">What is ....?</p>
        <p class="body">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>
      </div>

      <div id="faq2" class="panel tabcontent" onClick="goTo(this)">
        <p class="header">How does ... Work?</p>
        <p class="body">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>
      </div>

      <div id="faq3" class="panel tabcontent">
        <p class="header">Who are ...?</p>
        <p class="body">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>
      </div>

   </div>

function goTo (panel) {
  var url, faqs, para
    url = window.loaction;
    faqs = faq.getElementsByClassName("tabcontent");

  for (i = 0; i < faqs.length; i++) {
    para = faqs[i].getElementsByTagName("p")[0];

  if (url == panel) {
    url.replace(url + id);

  }
}

I want to make each panel to have its unique URL when clicked but I'm stuck.

Heretic Monkey
  • 11,687
  • 7
  • 53
  • 122
Dennis
  • 1
  • 1
  • What is `faq.getElementsByClassName("tabcontent")`? Based on the code you've provided(which has some other issues) that would return `undefined`. – APAD1 Oct 09 '19 at 18:09
  • You mean an unique [hash](https://stackoverflow.com/a/21850206/5568741)? – k3llydev Oct 09 '19 at 18:14

1 Answers1

2

There seems to be a typo in your code

url = window.loaction;

change to window.location

Also, window.location is an object and will never be equal to panel, so the condition would be always false. and id is undefined and will throw an error,

You are probably looking for something like

hash = window.location.hash;
if(hash!=panel) //assuming panel is the hash(that is, id of the clicked div)
  window.location.hash = panel;

Dhananjai Pai
  • 5,914
  • 1
  • 10
  • 25