2014-01-14 3 views
0

Чтобы сделать это просто:Как отменить jQuery.click из чистого кода javascript?

У меня есть веб-страница. Он имеет несколько сценариев, один из которых связывает событие click с тегом <a>.

$('#someId').click(function() { 
    ...... 
}); 

Я хочу добавить чистый JavaScript этой страницы (я не разрешено изменять другие JS-файлы) и взять под контроль события щелчка. Я попытался сделать следующее:

document.getElementById('someId').onclick = function (event) { 
    if (someCondition) { 
     // cancel this click event 
     event.preventDefault(); 
     event.stopPropagation(); 
     event.cancel = true; 
     return false; 
    } else { 
     // do something else. 
    } 
}; 

Этот фрагмент кода кажется неработоспособным. Мне нужна помощь.

UPDATE

Извините за мой неоднозначного языка. Под «чистым javascript» я подразумеваю «использование основных манипуляций с использованием javascript вместо методов jQuery».

+1

Почему ваше решение должны быть в «чистом JavaScript»? Почему вы не можете просто выполнить '$ ('# someId'). Off ('click')', а затем повторно привязать его? –

+1

В jQuery нет ничего «нечистого JavaScript». Возможно, вы имеете в виду, что хотите использовать только методы DOM. –

+1

Что вы подразумеваете под *** «кажется, не работает» ***? – RononDex

ответ

2

Существует еще одно возможное решение, но, к сожалению, оно имеет некоторые проблемы совместимости с браузером. Дело в том, чтобы использовать CSS pointer-events свойства и onmousedown события так:

$('a').click(function() { 
    alert('jquery'); 
}); 

var i = 0; 
btn.onmousedown = function(ev) { 
    if (i++ % 2 == 0) { 
     btn.style.pointerEvents = 'none'; // disable clicks 

     setTimeout(function() { 
      btn.style.pointerEvents = 'auto'; // enable back in 500 ms 
     }, 500); 
    } 
}; 

См совместимость here и демо here

Для IE вы можете попробовать элемент disabled недвижимости в таким же образом.

И, конечно, лучше использовать JQuery для этого (если он уже используется в вашем проекте)

3

Я хочу добавить чистый javascript на этой странице (мне не разрешено изменять другие js-файлы) и взять под контроль событие click.

Если код будет на этой странице, то он может использовать JQuery, что хорошо, потому что это также единственный способ, которым Вы можете разрегистрировать JQuery-зарегистрированный обработчик:

$("#someId").off("click").on("click", function() { 
    // Your new code here 
}); 

Calling .off("click") на элемент удаляет все Зарегистрированные jQuery click обработчики из этого элемента.

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


Почему вы не можете разрегистрировать JQuery-зарегистрированный обработчик без использования JQuery: первый раз, когда конкретное событие зацепляется конкретного элемента с помощью JQuery, JQuery регистрирует один обработчик (его собственный), чтобы использовать для это событие на этом элементе; если добавлено больше обработчиков, он просто добавляет их в свой собственный внутренний список, он не регистрирует их с DOM. Вместо этого, когда событие DOM запущено, jQuery просматривает список обработчиков и запускает их.

Чтобы отменить регистрацию фактического обработчика jQuery для события на элементе, вам нужно будет получить ссылку на экземпляр jQuery конкретной функции, используемый при его регистрации. (removeEventListener не имеет эквивалента выше «очистить все из них»). Это Ссылка доступна только из структур данных внутри закрытия jQuery, поэтому вы не можете получить ее без использования jQuery.


Что я должен делать, если другие обработчики должны возобновить быть выполнены при определенных обстоятельствах в $ .он() блок?

А, это намного сложнее. Все зависит от большего контекста, чем присутствует в вашем вопросе.Некоторые варианты:

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

  2. jQuery вызывает обработчики в том порядке, в котором они были зарегистрированы (это одна из причин, по которым он обрабатывает множество обработчиков, разные браузеры делают вещи в разных порядках). Поэтому, если вы можете подключить click по адресу #someIdдо, то другой код делает, тогда вы можете надежно использовать event.stopImmediatePropagation() для предотвращения вызова других обработчиков. Это не сработает, конечно, если ваш обработчик не первый в списке, потому что другие обработчики будут вызваны первыми.

  3. Если есть элемент внутри #someId элемента, который полностью заполняет его, вы можете подключить click на этого элемента вместо этого, а затем использовать event.stopPropagation(), чтобы предотвратить событие от барботирования до #someId элемента.

  4. И, конечно, если есть не элемент, как # 3, вы, вероятно, можете вставить один (динамически, с кодом) и двигаться #someId «s содержания в нем, так что вы можете придать свой обработчик в пузыриться.

  5. Вы можете погрузиться в внутренности jQuery и выяснить, как получить доступ к цепочке обработчика событий и манипулировать им. Раньше это было довольно легко; Я думаю, что последние версии сделали это сложнее. Разумеется, это произойдет на недокументированной территории, которая может измениться с помощью любой «точечной» версии.

+0

Что делать, если другим обработчикам необходимо возобновить выполнение при некоторых обстоятельствах в блоке $ .on()? – Lion

+0

@ Lion: Трудно сказать без лишнего контекста. Я добавил некоторые варианты ответа. Удачи, –

-1

После загрузки страницы необходимо добавить прослушиватель кликов.

window.onload=function(){ 
    //your code here. 
}; 

Если вы пытаетесь отключить кнопку после щелчка, добавьте свойство «инвалид» к кнопке и снимите щелчок слушателя.

document.getElementById('someId').onclick = null; 
document.getElementById('someId').disabled = true; 
Смежные вопросы