скрыть элемент, если один из братьев и сестер пуст - PullRequest
2 голосов
/ 28 марта 2012

Мне нужно скрыть содержимое div 'email', если div 'name' пусто.Я сделал это:

$(document).ready(function() {
    $('.media-contact').each(function() { 
        if ($(this).children('.name').text()===''){
         $(this).children('.email').hide();
        }
    }

});

Но это не работает.Таких медиа-контактов будет несколько, и не у всех будет имя div, заполненное значением, поэтому просто статический текст «Email» появляется и делает его уродливым.Я хочу пройтись по каждому медиа-контакту и проверить, если «имя» пусто, а если оно есть, то скрыть «электронная почта» .. пожалуйста, помогите ..

<div class="media-contact">
        <div class="name">
            Bill Bero
        </div>
        <div class="title">
            Communications and Media Relations Specialist
        </div>
        <div class="email">
            <a class="rc-link" href='mailto:will.kero@canalliance.org'><span><img src="/sites/dev/style%20library/images/design/icons/icon_email.png" alt=""/><em>EMAIL</em></span></a>
        </div>
        <div class="phone">
            <span class="baec5a81-e4d6-4674-97f3-e9220f0136c1" style="white-space: nowrap">
            219-661-3099, ext. 2
            </span>
        </div>
    </div>

Ответы [ 4 ]

1 голос
/ 28 марта 2012

Попробуйте:

$('.media-contact').each(function() {
    if ($.trim($(this).children('.name').text()) === '') {
        $(this).children('.email').hide();
    }
}​);​

См. Пример jsFiddle с одним именем и отсутствующим другим.

1 голос
/ 28 марта 2012

Сравнение text () с пустой строкой в ​​лучшем случае ненадежно и, вероятно, будет вести себя по-разному в разных браузерах.Проверка на «: empty» должна работать лучше, хотя в зависимости от того, как отображается страница, все еще может быть текстовый узел с новой строкой или что-то в этом роде.

$(document).ready(function() {
    $('.media-contact').each(function() { 
        if ($(this).children('.name').is(":empty")) {
         $(this).children('.email').hide();
        }
    }
});
0 голосов
/ 28 марта 2012

вот идея. используйте переключатель и логическое значение.

$(document).ready( function () {
    $('.media-contact').each( function () {
        $(this).find('.email')
            .toggle( $.trim( $(this).find('.name').text() ) !== '' );
    });
});
0 голосов
/ 28 марта 2012

Попробуйте это :

$(document).ready(function() {
    $('.media-contact').each(function() { 
        var $this = $(this);
        if ($this.find(".name").html().trim() == "") {
            $this.find(".email").hide();
        }
    }

});
...