Скрыть <li>, используя условие с Jquery

Question

Скрыть <li>, используя условие с Jquery

0

У меня html

<ul>
<li>option1: blue </li>
<li>option2: red</li>
<li>option3: </li>
<li>option4: green</li>
<li>option5: </li>
</ul>

То, что я хотел бы сделать, это скрыть li, если после опции: нет символов/значений.

У меня ограниченное знание с использованием запроса, и я еще не нашел пример, который поможет мне найти решение. Можно было бы при необходимости приложить значения красного, зеленого и т.д.

Можно ли это сделать с JQuery?

Browndog 03 янв. 2014, в 18:18

Источник

0

Почему бы не изменить свое представление так, чтобы опции без значения не отображались? Сокрытие избыточных вариантов не идеально.
Ben Smith 03 янв. 2014, в 17:20

Теги:

jquery

html

list

hide

3 ответа

0

$('#the-list li').each(function() {
    var text = $(this).text();
    if (!text.match(/option\d+: .+?/g)) {
        $(this).hide();
    }
});

Предполагая, что ваш список имеет id="the-list", конечно.

Сценарий: http://jsfiddle.net/edJy4/

Образец регулярного выражения объяснил: текст содержит строку символов, которая начинается с "опции", за которой следуют одна или несколько цифр, двоеточие, пробел и один или несколько символов. Если li не содержит такой строки, li скрыт.

Brian S 03 янв. 2014, в 15:33

0

В этом случае используется регулярное выражение:

$(function(){
    $('li').each(function(){
        if($(this).text().search(/option\d:\s\s*$/) == 0){
            $(this).hide();   
        }
    });
});

http://jsfiddle.net/pT8s2/

Mister Epic 03 янв. 2014, в 15:09

0

Спасибо за это решение, это был просто билет!
Browndog 07 янв. 2014, в 15:35
0

Круто, не стесняйтесь пометить как ответ, если это помогло вам!
Mister Epic 07 янв. 2014, в 15:40

Ещё вопросы

Почему бы не изменить свое представление так, чтобы опции без значения не отображались? Сокрытие избыточных вариантов не идеально.
Спасибо за это решение, это был просто билет!
Круто, не стесняйтесь пометить как ответ, если это помогло вам!

tymeJV · Accepted Answer · 2014-01-03T15-15-00.000Z

Что-то вроде этого будет работать:

$("ul li").each(function() {
    var optionText = $(this).text().split(":")[1];
    if (optionText.trim() == "")
        $(this).hide();
});

Сценарий: http://jsfiddle.net/44qeG/