Добавить прослушиватель событий для всех объектов, кроме нескольких выбранных? - PullRequest
6 голосов
/ 12 апреля 2011

Я пытаюсь добавить прослушиватель событий ко всем объектам, кроме нескольких выбранных (у выбранных также есть произвольные дочерние элементы на произвольных уровнях)?

Я задавал этот вопрос раньше, но так и не получил ответа на него. Я подошел близко, чтобы решить это. Не могли бы вы помочь мне с его отладкой?

Я добавляю прослушиватель событий в элемент тела с именем bodylistener и прослушиватель событий для нескольких выбранных элементов с именем selectedElementsMarkTrue. Из нескольких выбранных элементов, которые я не хочу выполнять, код слушателя selectedElementsMarkTrue выполняет pior к bodylistener с setTimeout function. selectedElementsMarkTrue устанавливает переменную selectedElements в true, а bodylistener проверяет, является ли selectedElements true перед выполнением кода сома. С моим кодом все еще что-то не так

    var selectedElements = false;
    var bodylistener = function(){
        window.setTimeout(function(){//Setting timeout so that the other handler, selectedElementsMarkTrue, always performs first
            (function(){
                if(selectedElements == false){
                    //Do some stuff
                }else{
                    selectedElements = false;
                }
            });
        }, 10);//Could be 0, but te be sure I set 10
    };
    var selectedElementsMarkTrue = function(){
        selectedElements = true;
    };
    $('#dontAddEventListener1, #dontAddEventListener2').each(function(){
        this.addEventListener('click', selectedElementsMarkTrue, false);
    });
    document.body.addEventListener('click', bodylistener, false);

Я не могу заставить функцию setTimeout выполнить основной код?

Ответы [ 2 ]

5 голосов
/ 12 апреля 2011

Звучит так, будто вы хотите, чтобы поведение было примерно таким:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            window.addEventListener("DOMContentLoaded", function() {
                document.body.addEventListener("click", function(e) {
                    var el = e.target;
                    do {
                        if (el.hasAttribute && el.hasAttribute("data-nofire")) {
                            return;
                        }
                    } while (el = el.parentNode);
                    alert('do stuff');
                }, true);
            }, false);
        </script>
    </head>
    <body>
        <p><span>click me</span></p>
        <p data-nofire><span>click me</span></p>
        <p data-nofire>click me</p>
        <p>click me</p>
    </body>
</html>

Или, вы могли бы сделать что-то, как предложил Нарен:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            window.addEventListener("DOMContentLoaded", function() {
                var nofire = document.getElementsByClassName("nofire");
                for (var i = 0; i < nofire.length; ++i) {
                    nofire[i].addEventListener("click", function(e) {
                        e.stopPropagation();
                    }, true);
                }
                document.body.addEventListener("click", function(e) {
                    alert('do stuff');
                }, false);
            }, false);
        </script>
    </head>
    <body>
        <p><span>click me</span></p>
        <p class="nofire"><span>click me</span></p>
        <p class="nofire">click me</p>
        <p>click me</p>
    </body>
</html>
0 голосов
/ 12 апреля 2011

предотвращение распространения событий путем обработки элементов click event

$('#dontAddEventListener1, #dontAddEventListener2').click( function(event){ event.preventDefault(); return false; });
...