0

Eu estou precisando manipular uma div a partir do click em outra div.

Basicamente, uma está em cima da outra, quero clicar na de cima e assim a de baixo executa o evento .toggled(). Porém uma não pode estar dentro da outra.

HTML

<div id="titulo" class=" toggled " align="left">Histórico</div>
<br>
<div id="divTabela">
    <table id="tabelainfo" name="tabelainfo" class=" bordasimples ">
    <thead>
    <tr id="titulotabela">
        <th>Data</th>
    </thead>
    <tbody>
    <tr id="corpotabela">
        <td align="center">15/5/2014 </td></tr>
    <tr id="corpotabelaalt" align="center">
        <td align="center">16/5/2014 10:56:10</td></tr>
    <tr id="corpotabela">
        <td align="center">16/5/2014 11:00:28</td></tr>
    </tbody>
    </table>
<br><br></div>

JavaScript

$("*").on("click", ".toggled", function(event){
    event.preventDefault();
    event.stopPropagation();

    console.log($(this));
    $(this).css({"color":"red","border":"2px solid red"});
    $(this).next("div").toggle();
});

JSFiddle

O que vocês me sugerem?

2 Respostas 2

3
$('#elemento-de-clicar').click(function(){
    $('#elemento-alvo').slideToggle();
 });
2
  • Insira o .next() entre o seletor e o método slideToggle(), assim a sua resposta estará certinha, assim como o novo Fiddle onde inseri a correção a partir da sua sugestão: jsfiddle.net/mayconfsbrito/2kLpu/4 Commented 23/05/2014 às 17:02
  • Esqueci do .next(). Muito obrigado ai por apontar rs.
    – dsantoro
    Commented 29/05/2014 às 17:01
0
<!-- HTML -->    
<p class="linkToggle">
   <strong><span>[+] </span>Detalhamento dos Pacotes de Serviços</strong>
</p>
<div class="lista forToggle">
    olá mundo!
</div>
<!-- HTML -->


<script>
       $('.linkToggle').click(function () {
             $(this).next(".forToggle").toggle('slow', function () { });
             var val = $(this).html();
             if (val.indexOf("[+]") > -1)
                  $(this).html(val.replace("[+]", "[-]"));
             else
                  $(this).html(val.replace("[-]", "[+]"));
        });
</script>
1
  • Recebe o click na classe ".linkToggle" e aplica a animação no próximo elemento com a classe ".forToggle".
    – Venatci
    Commented 23/05/2014 às 18:23

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .