Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal,
Tenha o seguinte menu
<ul class="menu">
<li><a href="#" title="Item 01">Item 01</a></li>
<li><a href="#" title="Item 02">Item 02</a></li>
<li><a href="#" title="Item 03">Item 03</a></li>
<li><a href="#" title="Item 04">Item 04</a></li>
</ul>Gostaria de saber como eu poderia ocultar uma li usando algo com o data-
...
<li data-num="2"><a href="#" title="Item 01">Item 01</a></li>
...Tipo ocultar todas as linhas que fossem menor 3.
Pois ocultar uma linha em expecifico eu consigo, porém encontra as linhas que possuam um numero menor do que o informado para ela ocultar eu não consigo.
Tentei percorrer todas as li porem não conseguia achar o valor da data-
Obrigado
Rola um jQuery na página? Se sim, uma opção é o filter.
Mas de que forma será disparada a ação?
Ao carregar...
Rola um jQuery na página? Se sim, uma opção é o filter.
Sim, você poderia colocar um exemplo, pois tipo não vejo a logica / como eu possa ocultar um <li> se o prametro dela for menor do que, o que eu quero que seja exibido.
Tipo
<li data-num="1"><a href="#" title="">Item 01</a></li>
<li data-num="1"><a href="#" title="">Item 02</a></li>
<li data-num="2"><a href="#" title="">Item 03</a></li>
<li data-num="3"><a href="#" title="">Item 04</a></li>
<li data-num="4"><a href="#" title="">Item 05</a></li>Ae pelo javascript, podendo ser até pelo jquery(solução que seria bem melhor). Ae tipo a logica seria assim
Se data-num(do HTML) for maior do(exemplo)2, não exibi-la(display:none ou hide)
Utilize pseudo-seletores - http://api.jquery.com/gt-selector
Exemplo :
HTML
<ul class="menu">
<li><a href="#" title="Item 01">Item 01</a></li>
<li><a href="#" title="Item 02">Item 02</a></li>
<li><a href="#" title="Item 03">Item 03</a></li>
<li><a href="#" title="Item 04">Item 04</a></li>
<li><a href="#" title="Item 05">Item 05</a></li>
<li><a href="#" title="Item 06">Item 06</a></li>
</ul>JS
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('.menu li:gt(2)').hide();
});
</script>Também pode utilizar um each em jquery...
$("#DivMenu li").each(function(){
if($(this).attr("data-num") < 3){
$(this).hide()
}
});>
Também pode utilizar um each em jquery...
$("#DivMenu li").each(function(){
if($(this).attr("data-num") < 3){
$(this).hide()
}
});Obrigado LukasWolf7, :) Funcionou perfeitamente !
Mas de que forma será disparada a ação?