1 reply to this topic

[flavianoguedes]

É o seguinte tenho essa tabela

<table id="mytable" cellspacing="0" summary="The technical specifications of the Apple PowerMac G5 series">
<caption>Tabela Produtos: Contêm os produtos pesquisados </caption>
  <tr>
    <th scope="col" abbr="codLabel" class="nobg">Código</th>
    <th scope="col" abbr="nomeLabel">Nome</th>
    
  </tr>
  <tr id="1"  >
    <th scope="row" abbr="code" class="spec">1</th>
    <td>Exemplo Exemplo</td> 
  </tr>
  <tr id="2"  >
    <th scope="row" abbr="code" class="spec">2</th>
    <td>Exemplo Exemplo</td> 
  </tr>
 
 
 
</table>

Eu queria saber como eu faço para que o codigo fique assim quando eu clicar na linha de id 1

<table id="mytable" cellspacing="0" summary="The technical specifications of the Apple PowerMac G5 series">
<caption>Tabela Produtos: Contêm os produtos pesquisados </caption>
  <tr>
    <th scope="col" abbr="codLabel" class="nobg">Código</th>
    <th scope="col" abbr="nomeLabel">Nome</th>
    
  </tr>

  <tr id="1"  >
   <div id="destacar">
     <th scope="row" abbr="code" class="spec">1</th>
     <td>Exemplo Exemplo</td>
   </div>
  </tr>
  <tr id="2"  >
    <th scope="row" abbr="code" class="spec">2</th>
    <td>Exemplo Exemplo</td> 
  </tr>
 
 
 
</table>

E assim quando eu clicar na linha 2 da tabela

<table id="mytable" cellspacing="0" summary="The technical specifications of the Apple PowerMac G5 series">
<caption>Tabela Produtos: Contêm os produtos pesquisados </caption>
  <tr>
    <th scope="col" abbr="codLabel" class="nobg">Código</th>
    <th scope="col" abbr="nomeLabel">Nome</th>
    
  </tr>

  <tr id="1"  >
  
     <th scope="row" abbr="code" class="spec">1</th>
     <td>Exemplo Exemplo</td>
   
  </tr>
 
  <tr id="2"  >
   <div id="destacar">
    <th scope="row" abbr="code" class="spec">2</th>
    <td>Exemplo Exemplo</td> 
   </div>

  </tr>
</div>
 
 
 
</table>

Ou seja eu quero adicionar uma div quando clicar em uma linha da tabela e o conteudo dessa linha que foi clicada tem que ficar dentro da div
usando jquery.
desde ja agradeço quem se despuser a mim ajudar

[william.js]

use este js

clie 3 div's com id exemplo div1,div2,div3.

<div id="div1">exemplo seu codigo aqui</div>

dentro desta div's adicione o codico do tablet

e faça a chama nos link.

<a href="#" onclick="valor('div1')"> div1</a>
 <a href="#" onclick="valor('div2')"> div2</a>
 <a href="#" onclick="valor('div3')"> div3</a>

<script type="text/javascript">
function valor(qual) {
if(qual=="div1") {
document.getElementById('div1').style.display="block";
document.getElementById('div2').style.display="none";
document.getElementById('div3').style.display="none";
}
if(qual=="div2") {
document.getElementById('div1').style.display="none";
document.getElementById('div2').style.display="block";
document.getElementById('div3').style.display="none";
}

if(qual=="div3") {
document.getElementById('div1').style.display="none";
document.getElementById('div2').style.display="none";
document.getElementById('div3').style.display="block";
}
}

</script>

EXEMPLO.

<a href="#" onclick="valor('div1')"> div1</a>
 <a href="#" onclick="valor('div2')"> div2</a>
 <a href="#" onclick="valor('div3')"> div2</a>
 
 <script type="text/javascript">
function valor(qual) {
if(qual=="div1") {
document.getElementById('div1').style.display="block";
document.getElementById('div2').style.display="none";
document.getElementById('div3').style.display="none";
}
if(qual=="div2") {
document.getElementById('div1').style.display="none";
document.getElementById('div2').style.display="block";
document.getElementById('div3').style.display="none";
}

if(qual=="div3") {
document.getElementById('div1').style.display="none";
document.getElementById('div2').style.display="none";
document.getElementById('div3').style.display="block";
}
}

</script>

<div id="div1" style="display:block;">seu código aqui</div>
<div id="div2" style="display:none;"><h3>visite o site mgdowns1.blogspot.com</h3></div>
<div id="div3" style="display:none;"><h1>Créditos William Silva</h1>