Click on a link go to another page and show the desired id

Question

Well, I need to make sure that when clicking a link from one page go to another and only show the content of the id indicated on the first page, can you do this? I’ve searched a lot of places and I can’t find exactly what I’m looking for.

index php.

<a href="interna.php" onclick="toggle_visibility('bloco1');"></a>
<a href="interna.php" onclick="toggle_visibility('bloco2');"></a>

internal.php

<div id="bloco1" style="display:none">
<div id="bloco2" style="display:none">

This is the javascript I used

<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
//-->
</script>

UPDATE Now the blocks are displayed but when I go to the second block all the functionalities of the links (for example back button) do not work, only the first block works perfectly. I noticed that in all links the code inserts internal.php? show=bloco1 for example, I don’t know if this is what’s troubling you now.

<a href="interna.php?exibir=bloco1"></a>
<a href="interna.php?exibir=bloco2"></a>

<script>

 function queryObj() {
    var result = {}, keyValuePairs = location.search.slice(1).split("&");
    keyValuePairs.forEach(function(keyValuePair) {
        keyValuePair = keyValuePair.split('=');
        result[decodeURIComponent(keyValuePair[0])] = decodeURIComponent(keyValuePair[1]) || '';
    });
    return result;
}

loads the content after everything is rendered

    $(document).ready(function () { 

calls the method to parse the url

    var objetoParaOcultar = queryObj();

shows div with id sent by parameter

    $('#' + objetoParaOcultar.exibir).show();
})
</script>

Answer 1

On its first page we will have the links on the page as below:

<a href="interna.php?exibir=bloco1">exibir 1</a>
<a href="interna.php?exibir=bloco2">exibir 2</a>

Already on your second page, we will have the following Javascript (remember to import jQuery before this code):

<script>

   function queryObj() {
      var result = {}, keyValuePairs = location.search.slice(1).split("&");
      keyValuePairs.forEach(function(keyValuePair) {
          keyValuePair = keyValuePair.split('=');
          result[decodeURIComponent(keyValuePair[0])] = decodeURIComponent(keyValuePair[1]) || '';
      });
      return result;
   }

   /*carrega o conteúdo apos tudo ser renderizado*/
   $(document).ready(function () { 

      /*chama o metodo para parsear a url*/
      var objetoParaOcultar = queryObj();

      /*mostra a div com o id enviado por parametro*/
      $('#' + objetoParaOcultar.exibir).show();

      /*Remove os parametro da url após mostrar a div*/
      window.location.href.replace(window.location.search,'');
   });

</script>

It works as follows: The function "parses" the parameter sent by its URL and then uses it to display the div.

I hope I’ve helped!