Как выбрать: hover, которого нет в определенном селекторе - PullRequest
Новая
       17

Как выбрать: hover, которого нет в определенном селекторе

0 голосов
/ 31 января 2011

Я хотел бы стилизовать a элементы, которые не имеют определенного идентификатора.Например, предположим, что это мой HTML: 

<div id="boat">
   <a href="#">I'm in a boat! ☻</a>
</div>
<a href="#">☹</a>

Теперь, скажем, я хочу только стилизовать элемент a, который не в лодке.Я ожидал, что что-то похожее на a:hover:not(#boat a) будет работать, но, увы, это не так.Есть ли способ, которым я могу сделать то, что я хочу сделать?

Ответы [ 3 ]

3 голосов
/ 31 января 2011

Когда дело доходит до селекторов jQuery, a:hover выберет все элементы a, к которым применен псевдокласс CSS :hover (т. Е. a элементы, которые в данный момент перемещаются с помощью мыши).

Это процесс выбора, а не выбор стиля , чтобы выбрать элементы, о которых вы говорите, попробуйте вместо этого: 

$('a:not(#boat a)')

DEMO: http://jsfiddle.net/marcuswhybrow/AMWhU/

Если при наведении указывается эффект jQuery, то после того, как вы сделали выделение, просто привяжите событие как обычно: 

$('a:not(#boat a)').hover(function() {});
0 голосов
/ 31 января 2011

Похоже, вы можете использовать отрицательный селектор атрибута ('! ='). Учитывая (в основном) ваш оригинальный HTML: 

<script src="/Users/kburton/Downloads/jquery-1.4.4.min.js">
    </script>
<div id="boat">
  <a href="#">I'm in a boat!</a>
</div>
<div id='car'>
  <a href="#">I'm in a car!</a>
</div>
<a href="#">I'm not in the boat!</a>

На консоли javascript, запустив: 

$('[id!="boat"] > a')

Ищет все узлы, у которых нет идентификатора 'boat' с дочерним якорем.

0 голосов
/ 31 января 2011

Ссылки, не входящие в эту div#id, будут иметь .closest('div#id').length === 0, и, поскольку 0 имеет значение false, вы можете выбрать противоположную из следующих, чтобы стилизовать эти ссылки: 

$('a').hover(function(e){
    if (!$(this).closest('div#boat').length) {
        // YOUR CODE HERE
    }
});

Вот пример.

...