jQuery включает функцию toggleClass(), а затем отключает (или удаляет)

#javascript #jquery #html #css #angularjs

#javascript #jquery #HTML #css #angularjs

Вопрос:

Я использую директиву angular для отображения левого и правого столбцов страницы. <left-column></left-column> и <right-column></right-column> . Когда пользователь <a href="#target1">Target 1</a> нажимает, он находит соответствующий <div id="target1">Target 1</div> в правом столбце.

Это работает нормально, и то, что я пытаюсь сделать сейчас, — это то, что после нажатия на него фон конкретного div должен как бы мигать или что-то в этом роде, у меня есть для этого некоторый css. Итак, я хочу переключить этот класс css, а затем через секунду удалить этот класс (или отключить его).

Я пытаюсь использовать setTimeout() функцию, но, похоже, она не работает. Есть идеи?

Моя ошибка:

 Uncaught TypeError: Cannot read property 'toggleClass' of undefined

Мой js:

 var highlight = {

    onReady: function() {

        $(document).on('click', 'left-column > div', function(event) {

            var id = $('a', this).attr('href').split('#');
            var target = $('right-column > div').find('#'   id[1]);

            target.toggleClass('gas');
            var junk = setTimeout(function(target) {
                target.toggleClass('gas');
            }, 1000);

            event.preventDefault();

        });

    }

};


$(document).ready(highlight.onReady);

1. Ха-ха, приятно, но не уверен, что вы имеете в виду, является ли backOff() реальной функцией?

2. Пожалуйста, опубликуйте скрипку, чтобы мы могли видеть, что вы видите.

3. Нет … заголовок был забавным

4. Попробуйте использовать target[0].toggleClass('gas'); или target.each(function(){$(this).toggleClass('gas')});

5. Не связанный (вроде), если вы получите привязку, вы можете просто сделать $('a', this).prop('hash') . Я считаю, что это будет включать # , поэтому вам не нужно будет добавлять его обратно. Кроме того, поскольку вы находите идентификатор, вы можете просто использовать $(id) , а не find вводить его в столбец.

Ответ №1:

Ваша проблема заключается в том, что вы ожидаете target в качестве аргумента в переданном обратном setTimeout вызове, но на самом деле не передаете никаких аргументов, поэтому target локальный для setTimeout обратного вызова скрывает (затеняет) доступ к target доступному во внешней области.

Удаление target из параметров обратного вызова исправит вашу ошибку:

 var junk = setTimeout(function(/* remove target from here */) {
  target.toggleClass('gas');
}, 1000);

Или вы можете явно передать его, если хотите, но это было бы излишним, поскольку оно уже доступно:

 var junk = setTimeout(function(target) {
  target.toggleClass('gas');
}, 1000, target); // <--- you can pass the target along here

1. Потрясающе, я думаю, когда я изначально создавал функцию, я все переосмыслил. (Я приму ваш ответ через несколько минут, когда система позволит мне.) Спасибо!

2. Нет проблем, приятель, рад помочь 🙂