javascript - disable - ¿Cómo puedo deshabilitar un elemento LI específico dentro de un UL?
html li readonly (4)
Normalmente uso <li> para incluir el enlace <a> . He desactivado la acción de hacer clic escribiendo así; No puedes incluir el enlace <a> , entonces ignorarás mi publicación.
a.noclick {
pointer-events: none;
}
<a class="noclick" href="#">this is disabled</a>
Tengo un menú que es un <ul> . Cada elemento del menú es un <li> y actualmente se puede hacer clic. Basado en algunas condiciones, quiero deshabilitar (hacer que no se pueda hacer clic) en un elemento <li> particular. ¿Cómo puedo conseguir esto? Intenté usar el atributo disabled en <li> y list-style:none también. Tampoco funcionó. ¿Alguna sugerencia?
Si aún desea mostrar el elemento, pero no puede hacer clic y se ve deshabilitado con CSS:
CSS:
.disabled {
pointer-events:none; //This makes it not clickable
opacity:0.6; //This grays it out to look disabled
}
HTML:
<li class="disabled">Disabled List Item</li>
Además, si está utilizando BootStrap, ya tienen una clase llamada deshabilitada para este propósito. Vea este ejemplo .
Usando CSS3: http://www.w3schools.com/cssref/sel_nth-child.asp
Si esa no es una opción por cualquier motivo, puede intentar dar clases a los elementos de la lista:
<ul>
<li class="one"></li>
<li class="two"></li>
<li class="three"></li>
...
</ul>
Luego en tu css:
li.one{display:none}/*hide first li*/
li.three{display:none}/*hide third li*/
Usando JQuery: http://api.jquery.com/hide/
$(''li.two'').hide()
En:
<ul class="lul">
<li class="one">a</li>
<li class="two">b</li>
<li class="three">c</li>
</ul>
En el documento listo.