addclass removeclass

[Marcos_imasters 288]

Boa noites prezados companheiros do imasters estou aqui hoje com uma mega duvida estou tentado adiciona e remove uma class no meu menu estou tentado fazer da seguinte forma.

<li onclick="abrirmenu('submenu2')" class="active">
<a class="vnav-item">
<i class="icon-video"></i>
Videos
<span class="vnav-counter">5 ver todos</span>
</a>
<ul class="vnav-subnav" id="submenu2">
<li><a href="#">Adicionar video</a></li>
<li><a href="#">Alterar dados</a></li>
<li><a href="#">Deletar video</a></li>
</ul>
</li>

 

no js

 

<script src="js/jquery.min.js" type="text/javascript"></script><script src="js/jquery.min.js" type="text/javascript"></script> <li onclick="abrirmenu('submenu2')" class="active">
<a class="vnav-item">
<i class="icon-video"></i>
Videos
<span class="vnav-counter">5 ver todos</span>
</a>
<ul class="vnav-subnav" id="submenu2">
<li><a href="#">Adicionar video</a></li>
<li><a href="#">Alterar dados</a></li>
<li><a href="#">Deletar video</a></li>
</ul>
</li> <li onclick="abrirmenu('submenu2')" class="active">
<a class="vnav-item">
<i class="icon-video"></i>
Videos
<span class="vnav-counter">5 ver todos</span>
</a>
<ul class="vnav-subnav" id="submenu2">
<li><a href="#">Adicionar video</a></li>
<li><a href="#">Alterar dados</a></li>
<li><a href="#">Deletar video</a></li>
</ul>
</li>function abrirmenu(id_list) {
if (!document.getElementById) return;
var ob = document.getElementById(id_list).style;
ob.display = (ob.display == 'block')?'none': 'block';
}

$('.vnav-item').click(function(){
$(this).addClass('active');
});

 

[YFilus 14]

Olá Marcos, tudo bem?

 

Acho que o seguinte código vai te ajudar:

 

<li class="active js-open-submenu">
	<a class="vnav-item">
		<i class="icon-video"></i>
		Videos
		<span class="vnav-counter">5 ver todos</span>
	</a>
	<ul class="vnav-subnav js-subnav">
		<li><a href="#">Adicionar video</a></li>
		<li><a href="#">Alterar dados</a></li>
		<li><a href="#">Deletar video</a></li>
	</ul>
</li>

<script>
	$(".js-open-submenu").click(function() {
		$(this).find(".js-subnav").toggle();
	});
	$(".vnav-item").click(function(){
	    $(this).toggleClass("active");
	});
</script>

É sempre bom separar o conteúdo da apresentação. Então removi o "onclick" do li, e adicionei a classe "js-open-submenu", para depois fazer uma função em javascript com ela.

 

Espero ter te ajudado!

Abraço!

[Marcos_imasters 288]

poxa vida aqui nao funcionou :(

[YFilus 14]

Adicionei também a class "js-subnav" no submenu "vnav-subnav".

 

Com aquele código que postei ali, testando localmente, etá funcionando. Dê uma olhada no console, por favor, e veja se tem algum erro. Ele poderia estar pausando a execução do js. (Para ir lá aperte F12, e vá para a última tab)

 

Se você tivesse o link com o problema ajudaria.

 

Até mais.

[Marcos_imasters 288]

Yfiles tentei nao pega aqui dei conta de fazer um pouco soh que queria quando eu clicasse adicionasse a class

 

veja o exemplo:

http://aurasistemas.com.br/noticias/admin/main.html

Resolvido obrigado yfiles pela ajuda.

 

Solução:

 

HTML

<ul class="menu"><li><span>texte</span></li><li><span>texte 2</span></li><li><span>texte 3</span></li>JQUERY

<script> $('.menu li').on('click', function(){ $(this).addClass('active').siblings().removeClass('active'); }); </script>

</ul>