0

Na página de um produto existem dois links: 1 com a quantidade de comentários que já existem para o produto e outro dizendo "Escreva um comentário". Mais para baixo na página existe uma "aba" tab com a parte de comentários. Quando você clica no link ele aciona a aba dos comentários, mas não desliza a tela até lá então parece que o link nem faz nada. O que é preciso fazer para que esse link tenha essas duas funções ao mesmo tempo?

Obs.: Já tentei simplesmente colocar #tab-review no href NÃO FUNCIONA

Código dos Links:

<a href="" onclick="$('a[href=\'#tab-review\']').trigger('click'); return false;"><?php echo $reviews; ?></a> / <a href="" onclick="$('a[href=\'#tab-review\']').trigger('click'); return false;"><?php echo $text_write; ?></a></p> 

Link da página: https://www.lupmed.com.br/bandagem-dynamic-tape-preto-5

4 Respostas 4

1

Tente criar uma função no clique e chamar todas ações dentro dela, exemplo:

<a href="javascript:void(0)" onclick="scrollToComentarios()">Escreva um comentário</a>

<script>
function scrollToComentarios() {
    if ($('.product-tabs').length != 0) {
        $('a[href=\'#tab-review\']').trigger('click');
        $('#input-name').focus();  // adiciona foco ao primeiro input do form de comentarios
        $("html, body").animate({
            scrollTop: $('.product-tabs').offset().top
        }, 1000);
    }
}
</script>
3
  • 1
    Funcionou Exatamente como eu precisava. Muito obrigado! Commented 15/01/2018 às 13:37
  • Tem como já deixar o input "acionado" também? Para o usuário não precisar clicar Commented 15/01/2018 às 13:46
  • Tem sim, editei a resposta com esse novo elemento Commented 15/01/2018 às 13:48
1

Coloca a ID #tad-review na referência do seu link.

Ex:

<a href="#tab-review" onclick="$('a[href=\'#tab-review\']').trigger('click'); return false;"><?php echo $reviews; ?></a> / <a href="" onclick="$('a[href=\'#tab-review\']').trigger('click'); return false;"><?php echo $text_write; ?></a></p>

6
  • Não funciona :( Commented 15/01/2018 às 13:08
  • Então pode ser que o onclick esteja prevenindo a href... tenta colocar pelo seu jQuery no onclick: window.location.href='#tab-review'; Commented 15/01/2018 às 13:11
  • Não funcionou :( Commented 15/01/2018 às 13:25
  • Caraca bixo, uma terceira alternativa que eu vejo é usar o scrollTop no seu onlick... $('html, body').scrollTop(0); Ai troca o '0' pela quantidade de pixel que vc deseja descer. Commented 15/01/2018 às 13:33
  • como faz isso exatamente? Commented 15/01/2018 às 13:34
0

Ola. é só você colocar assim

<a href = '#Exemplo'>Vá para o paragrafo sobre JS</a>
<p id ="Exemplo" name="Exemplo">JS Java Script</p>

é só colocar no link a mesma coisa que você colocou no nome e no id do parágrafo que vc deseja redirecionar o usuario

Segue um link caso ainda tenha dúvidas http://www.otimizacao-sites-busca.com/links/links-navegacao-mesma-pagina.htm

7
  • Não, não funciona. Já tentei isso Commented 15/01/2018 às 13:07
  • aparece algum erro ou simplesmente não redireciona?
    – Gabriel.H
    Commented 15/01/2018 às 13:13
  • Não aparece erro Commented 15/01/2018 às 13:16
  • Se você tiver usando Bootstrap dá pra fazer isso , colocar isso no paragrafo a ser direcionado Colocar o titulo do paragrafo como um link com esses atributos , ou criar um link ao lado do titulo com um icone talvez , para o usuario ser direcionado para o link ao lado do titulo <a class="anchorjs-link " href="#css" aria-label="Anchor" data-anchorjs-icon="#" ></a>
    – Gabriel.H
    Commented 15/01/2018 às 13:20
  • Se isso não ajudar tenta tirar o script do seu link e só deixar o link html msm
    – Gabriel.H
    Commented 15/01/2018 às 13:21
0

Colega, como as outras alternativas não deram certo, você pode usar o ScrollTop junto no seu onclick. Oo códico é:

$('html, body').scrollTop(0);

Suponha que o local que vc deseja descer está à 1200px do topo, aí coloca essa quantidade no lugar do zero:

$('html, body').scrollTop(1200);

No seu código, ficaria assim:

<a href="#tab-review" onclick="$('html, body').scrollTop(**1200**); $('a[href=\'#tab-review\']').trigger('click'); return false;"><?php echo $reviews; ?></a> / <a href="" onclick="$('a[href=\'#tab-review\']').trigger('click'); return false;"><?php echo $text_write; ?></a></p
2
  • E como que eu faço o responsivo disso? Tem como? Commented 15/01/2018 às 13:41
  • Dá sim, é melhor vc chamar uma função e colocar as condições dentro dela... Ex: se for desktop > descer até 1200px, se for mobile > descer até 1700px Commented 15/01/2018 às 13:43

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 .