Ik heb op mijn vakantie pagina 3 tabjes staan, tab 1 wordt standaard geopend. Deze tabjes werken met behulp van ajax, dus er is geen zichtbare load van de pagina. In tab 1 staan de accommodatiegegevens, in tab 2 staan de prijzen en in tab 3 staan soortgelijk accomodaties. Nu is het zo dat er op deze vakantie pagina altijd een button aanwezig is die linkt naar een anker onderaan bij tab 1. Als ik dus voor de eerste keer op de vakantie pagina kom (op tab 1 dus), dan werkt deze link naar het anker gewoon goed. Als ik daarna echter naar tab 2 of 3 ga, en dan weer klik op de link naar het anker in tab 1, dan werkt het niet meer en gebeurt er helemaal niets. Ik denk dat dit komt doordat het systeem het anker dan niet ziet aangezien 'de ankercode' onder de code van tab 1 zit.

Ik gebruik de volgende code:

De volgende code gebruik ik in de header:

<script language="JavaScript" type="text/javascript"> 
function makeactive(tab) { 
document.getElementById("tab1").className = ""; 
document.getElementById("tab2").className = ""; 
document.getElementById("tab3").className = ""; 
document.getElementById("tab"+tab).className = "active"; 
callAHAH('/content.php?content=' + tab + '&product=<?php echo $_GET['product']; ?>', 'content', 
     'getting content for tab '+tab+'. Wait...', 'Error'); 
} 
</script> 


De volgende code laad ik ook nog in:

function callAHAH(url, pageElement, callMessage, errorMessage) { 
     document.getElementById(pageElement).innerHTML = callMessage; 
     try { 
     req = new XMLHttpRequest(); /* e.g. Firefox */ 
     } catch(e) { 
       try { 
       req = new ActiveXObject("Msxml2.XMLHTTP");  /* some versions IE */ 
       } catch (e) { 
         try { 
         req = new ActiveXObject("Microsoft.XMLHTTP");  /* some versions IE */ 
         } catch (E) { 
          req = false; 
         } 
       } 
     } 
     req.onreadystatechange = function() {responseAHAH(pageElement, errorMessage);}; 
     req.open("GET",url,true); 
     req.send(null); 
  } 

function responseAHAH(pageElement, errorMessage) { 
   var output = ''; 
   if(req.readyState == 4) { 
      if(req.status == 200) { 
         output = req.responseText; 
         document.getElementById(pageElement).innerHTML = output; 
         } else { 
         document.getElementById(pageElement).innerHTML = errorMessage+"\n"+output; 
         } 
      } 
  } 


Content.php:
Hier staat dan de betreffende content afhankelijk van de geselecteerde tab.
<?php
if ($_GET['content'] == 1)
{

}
if ($_GET['content'] == 2)
{

}
if ($_GET['content'] == 3)
{

}
?>

De product pagina:

<li onclick="makeactive(1)" id="tab1" class=""><a href="#">Accommodatie</a></li> 
        <li onclick="makeactive(2)" id="tab2" class="active"><a href="#">Prijzen</a></li> 
        <li onclick="makeactive(3)" id="tab3" class=""><a href="#">Soortgelijke producten</a></li>


Heeft iemand nu misschien enig idee hoe ik het voor elkaar kan krijgen dat bijvoorbeeld vanaf tab 3 de link naar het anker toch nog goed werkt zodat je in 1 keer naar tab 1 gaat EN ook nog eens direct naar het anker onderaan de pagina gaat?
Pas je script even aan en gebruik [ignore]
 en 
[/ignore] tags om je code heen. Gebruik je knop om dit te doen.

SanThe.
Aangepast, is nu heel wat overzichtelijker. Bedankt! :-)

Reageren