Удалить: парить в JavaScript - PullRequest
Новая
       60

Удалить: парить в JavaScript

2 голосов
/ 24 января 2012

У меня следующий код JavaScript: 

$('#s2 a').click(function(){
    var cB = $(this);
    var f = parseInt(cB.attr('data-f'));
    var r = parseInt(cB.attr('data-r'));
    var c = parseInt(cB.attr('data-c'));
    if (pA == false && !isClickAllowed(f,r,c)) {
        return false;
    }
    // more stuff comes here 
}

Это делает ссылку недоступной для клика.Это все работает.Я также хочу удалить эффект наведения.Код CSS для этого: 

.pc a:hover {
    background-color: #FFF;

Я думал, что удаление класса сделает это следующим образом: cB.removeClass('pc');, но это не сработает.

Есть предложения о том, как это сделать?

Спасибо за ваше время

- РЕДАКТИРОВАТЬ -

Хм Я думаю, я понимаю, почему это не работает.В верхней части документа у меня есть это: 

$(document).ready(function() {
    setScale();
    $(window).resize(setScale);
    if (!('ontouchstart' in document)) {
        $('body').addClass('pc');
    } 
        more code here

Устанавливает .pc a:hover для всех ссылок при открытии страницы на ПК, а не на сенсорное устройство (например, iPad).Мне нужно отключить этот компьютер наведите курсор ТОЛЬКО на ссылки, на которые нельзя нажимать, как в: 

if (pA == false && !isClickAllowed(f,r,c)) {
        return false;
    }

Надеюсь, это поможет!

Ответы [ 6 ]

6 голосов
/ 24 января 2012

cB - это якорь, который не является ссылкой на указанный класс CSS, у родителя будет класс pc, чтобы это работало. cB.parent().removeClass('pc'); сделает это.

- РЕДАКТИРОВАТЬ -

После эрудированных комментариев ниже может показаться, что cb.parents('.pc').removeClass('pc') или cb.parents().removeClass('pc') (я не проверял, чтобы увидеть, что быстрее) будет всеобъемлющим решением.

Хороший улов Джеймсу, Энтони и Тейдеку!

- РЕДАКТИРОВАТЬ 2 -

После обновления вопроса я бы предложил добавить еще один класс к вашим ссылкам, т.е. clickable, тогда ваш CSS станет: 

.pc a.clickable:hover {
    background-color: #FFF;

и вы можете просто удалить класс clickable на тех ссылках, которые вы не хотите показывать подсветкой. Лучшим вариантом действий может быть простая замена отключенных ссылок либо на необработанный текст, либо в виде промежутков на идентифицирующий класс, т. Е. disabled_link, если вы хотите иметь возможность включить их позже.

3 голосов
/ 24 января 2012

Хотя не было предоставлено HTML, основываясь на коде, cB представляется не элементом, который имеет класс pc, а скорее предком cB. Вам нужно удалить класс из этого.

Если прямой родитель является единственным предком с классом pc, вы можете сделать следующее: 

cB.parent().removeClass("pc")

Если только один предок, отличный от прямого родителя, имеет класс pc, а родитель - нет, вы можете сделать следующее: 

cB.closest(".pc").removeClass("pc")

Если у нескольких предков есть класс pc, вы можете использовать следующее: 

cB.parents(".pc").removeClass("pc")

И, наконец, если в .pc существует несколько тегов a, вы не можете использовать подход удаления класса, так как это повлияет на все теги a в этом .pc.

0 голосов
/ 24 января 2012

Поскольку ваша проблема с CSS уже решена, я хочу отметить еще одно улучшение: Я вижу, что вы используете cB.attr ('data-f') для хранения некоторых данных, но attr следует использовать только для допустимых атрибутов HTML. Вам следует рассмотреть возможность использования метода данных jQuery, который был создан исключительно для хранения данных без атрибутов в элементе.
http://api.jquery.com/jQuery.data/

0 голосов
/ 24 января 2012

Я бы добавил класс disabled в CSS, который следует за правилом :hover, и переопределил бы его отключенными стилями, которые могут быть или не быть по умолчанию. Затем вы можете просто сделать: 

cB.addClass('disabled');

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

0 голосов
/ 24 января 2012

cB.removeClass ('pc') действительно должен удалить класс. Убедитесь, что ваш CSS ведет себя правильно во всех сценариях. Также попробуйте нацелиться на родителя

0 голосов
/ 24 января 2012 
<p id="example">This is an example.</p> 

<script>
  document.getElementById('example').style.borderWidth = '4px';
</script>

Обратите внимание, что borderWidth отличается от border-width.Это может быть использовано для других стилей.Как правило, уберите черту и сделайте первую букву второго слова заглавной.Если это не сработает, Google его.

...