JQuery если заявление поможет - PullRequest
0 голосов
/ 29 марта 2010

Я хочу знать, как правильно написать оператор if с помощью jquery. У меня есть куча div с якорем в каждом, который при нажатии увеличивает ширину div с помощью toggleClass. Это прекрасно работает, но я хочу написать оператор if, который проверяет, применен ли к тому же классу другой div, если это так, сожмите этот div, а затем разверните следующий div (надеюсь, это имеет смысл), мой код пока: *

HTML:

<div class="content-block">
    <h2>Title</h2>
    <p>Content...</p>
    <a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
    <h2>Title</h2>
    <p>Content...</p>
    <a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
    <h2>Title</h2>
    <p>Content...</p>
    <a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
    <h2>Title</h2>
    <p>Content...</p>
    <a class="expand" href="#">Expand View</a>
</div>

Jquery:

$(document).ready(function(){
$('a.expand').click(function(){
    $(this).parent('.content-block').toggleClass('wide');
});

});

Ответы [ 3 ]

3 голосов
/ 29 марта 2010

Вы можете сделать это следующим образом, в этом случае нет необходимости, если:

$(document).ready(function(){
  $('a.expand').click(function(){        
    $(this).parent('.content-block').toggleClass('wide')
           .siblings('.wide').removeClass('wide');
  });
});

Это переключает широкий класс на родительском, а затем удаляет класс из всех его родных.

1 голос
/ 29 марта 2010

Нет необходимости в операторе if, просто запустите removeClass() для всего, к чему применяется класс wide:

$(document).ready(function(){
    $('a.expand').click(function(){
        $('.content-block.wide').removeClass('wide');
        $(this).parent('.content-block').addClass('wide');
    });
});

А для производительности просто используйте addClass() и removeClass() вместо toggleClass()

0 голосов
/ 29 марта 2010

Вы хотите написать что-то вроде этого:

var otherExpanded = $('.content-block.wide');
if (otherExpanded.length)
    //Do things
...