+- Forum Pplware (http://forum.pplware.com)
+-- Fórum: Mais Tech (/forumdisplay.php?fid=11)
+--- Fórum: Programação e Web (/forumdisplay.php?fid=16)
+--- Tópico: Jquety - mudar classes de LI (/showthread.php?tid=10354)
Páginas: 1 2
Jquety - mudar classes de LI - Article0 - 19-12-2011 11:53
Boas
Estou a tentar mudar a class de uma LI quando carrego nela e simplesmente ja tentei algumas funções e nada, como por exemplo,
$(document).ready(function () {
$('li.li2').click(function () {
$('#link2').removeClass('sub').addClass('left');
ou
$('#link2').css('color, 'green');
});
});
Tentei estas basicas, pois nao tem nenhum filho e nenhum pai.
Podem me ajudar?
codigo da LI (é uma LI dentro doutra, como uma subLI):
<asp:Repeater ID="RepeaterSubMenu" runat="server" OnItemDataBound="RepeaterSubMenu_ItemDataBound">
<ItemTemplate>
<li class="li2"><a id="link2" runat="server" class="sub">
<asp:Literal ID="LiteralName" runat="server"></asp:Literal></a>
</ItemTemplate>
</asp:Repeater>
Css:
.sub:link{color: #514e4c;padding-left: 28px;padding-bottom: 5px;padding-top: 5px;float: left;}
.sub:visited{color: #514e4c;}
.sub:active{color: #514e4c;}
.sub:hover{color: #99CC00;margin-right: 0px;margin-left: 0px;}
.left:link{color: #99CC00;padding-left: 28px;padding-bottom: 5px;padding-top: 5px;float: left;}
.left:visited{color:#99CC00;}
.left:active{color: #99CC00;}
.left:hover{color: #99CC00;margin-right: 0px;margin-left: 0px;}
Como devem reparar, quero carregar no Link2 (respectivo ao LI2) e assim trocar de class.
Agradeço a quem me puderr ajudar
Cumprimentos,
Article0
RE: Jquety - mudar classes de LI - Bruno Bernardino - 19-12-2011 12:02
A menos que estejas a dar referências (id's, classes ou objectos) erradas, deveria funcionar.
Já experimentaste fazer um debug para confirmar se está a ser executado o código quando clicas? (tip: console.log())
A única forma que vejo para isso não funcionar é se estiveres a adicionar esses elementos depois do DOM já estar carregado (por exemplo, por javascript/ajax). Nesse caso, terás de usar o live('click') em vez do click().
RE: Jquety - mudar classes de LI - Article0 - 19-12-2011 12:11
Ja exprimentei fazer um debug e por o live('click') e tambem nada.
Se eu puser um alert(' ') o gajo ate me apresenta a caixa. A minha duvida é... Como as 3 Li vao mandar a uma pagina, será que faz a função quando carrego mas deixa de fazer efeito quando carrega a pagina onde a LI mandou? Pode ser isso.
Queria fazer algo como isto: http://www.java2s.com/Tutorial/JavaScript/0571__jQuery/Allliunderulbutnotaclassname.htm
Eu pensava que podia fazer desta maneira
RE: Jquety - mudar classes de LI - Bruno Bernardino - 19-12-2011 12:30
Desculpa lá, mas tens aí incoerências no que dizes que me leva a acreditar que não estás a fazer bem o debug.
De qualquer das formas, se o link vai para outro lado, o teu problema é obviamente esse. Tens de fazer um return false no evento de click do anchor, ou pelo menos um event.preventDefault();
RE: Jquety - mudar classes de LI - Article0 - 19-12-2011 12:32
Ja exprimentei fazer um debug e por o live('click') e tambem nada.
Se eu puser um alert(' ') o gajo ate me apresenta a caixa. A minha duvida é... Como as 3 Li vao mandar a uma pagina, será que faz a função quando carrego mas deixa de fazer efeito quando carrega a pagina onde a LI mandou? Pode ser isso.
Queria fazer algo como isto: http://www.java2s.com/Tutorial/JavaScript/0571__jQuery/Allliunderulbutnotaclassname.htm
Eu pensava que podia fazer desta maneira
RE: Jquety - mudar classes de LI - Berto - 19-12-2011 12:54
Boas,
Não sei se foi erro de copy paste, mas vejo para já um problema no repeater, falta fechar o li. Outra coisa que não tenho a certeza, é que ao fazer o <a runat="server"> se o id do lado do cliente não é gerado no server side.
Tens o firebug instalado?
RE: Jquety - mudar classes de LI - Article0 - 19-12-2011 13:09
Sim tenho o firebug instalado.
O fecho da LI foi culpa do paste, pois aqui ta fechado. Acho que nesse caso do id gerado, nao a problema pois ele ja executou varias funções que fiz.
O problema é mesmo do codigo. Com o firebug, fui por o codigo na consola e nada.
Faltou me por uma coisa:
<ul class="dl3">
<asp:Repeater ID="RepeaterSubMenu" runat="server" OnItemDataBound="RepeaterSubMenu_ItemDataBound">
<ItemTemplate>
<li class="li2"><a id="link2" runat="server" class="sub">
<asp:Literal ID="LiteralName" runat="server"></asp:Literal></a></li>
</ItemTemplate>
</asp:Repeater>
</ul>
Esta é a estrutura do subLI.
tentei fazer isto:
$('#link2').removeClass('sub').addClass('left');
$('.dl3').removeClass('left');
$(this).parent().addClass('left');
$('#link2.dl3').removeClass('sub').addClass('left');
e nao da, ja testado no console do firebug. Ideias?
RE: Jquety - mudar classes de LI - Bruno Bernardino - 19-12-2011 13:15
mas os identificadores estão correctos? Ou seja, a referência para $('#link2') existe mesmo? (o que te retorna na consola um $('#link2').length ?) Isto sem links é muito complicado...
RE: Jquety - mudar classes de LI - Article0 - 19-12-2011 13:20
vou fazer o seguinte.
O site que estou a desenvovler é: http://wingerconsulting.spirituc.com/
O que estou a dizer é no menu do lado esquerdo onde nas actividades, soluções e produtos, quando carrego e vai para a pagina dele, o nome tem de ficar verde.
O resto ja tenho em cima
RE: Jquety - mudar classes de LI - Berto - 19-12-2011 16:39
Deixa ver se percebo o que queres:
Quando carregas num link e vais para a página, queres que o menu fique selecionado, i.e. quando estou em "Produtos", este fique com o estilo de selecionado, correcto? Se é esta a intenção e os pedidos são em post-back, pq não fazes isto no servidor? Ou seja, quando estás a escrever o menu (repeater), escreves no li (acho que é no li) o estilo a indicar que estás nessa area? É que ao fazer o click, tas a fazer um post-back e perdes todas a referencias para tudo o que tinhas nessa página.
Percebi mal?