Об этом говорится в учебнике Python (прокрутите немного вниз, пока не дойдете до части обрезки).
Диаграмма искусства ASCII также полезна для запоминания того, как работают срезы :
+---+---+---+---+---+---+
| P | y | t | h | o | n |
+---+---+---+---+---+---+
0 1 2 3 4 5 6
-6 -5 -4 -3 -2 -1
. Один из способов вспомнить, как работают срезы, - это указать индексы как указывающие между символами , с левым краем первого символа с номером 0. Тогда правый край последнего символа строки из символов n имеет индекс n .
Невозможно проверить, существуют ли динамически подключенные прослушиватели событий.
Единственный способ узнать, подключен ли прослушиватель событий, - это добавить прослушиватели событий следующим образом:
elem.onclick = function () { console.log (1) }
Затем вы можете проверить, подключен ли прослушиватель событий к onclick
, возвращая !!elem.onclick
(или что-то подобное).
tl; dr: Нет, вы не можете сделать это любым способом, поддерживаемым изначально.
Единственный способ, который я знаю для достижения этого, - создать пользовательский объект хранения, в котором вы храните запись добавленных слушателей. Что-то в следующих строках:
/* Create a storage object. */
var CustomEventStorage = [];
Шаг 1: Сначала вам понадобится функция, которая может перемещаться по объекту хранения и возвращать запись элемента, заданного элементом (или false).
/* The function that finds a record in the storage by a given element. */
function findRecordByElement (element) {
/* Iterate over every entry in the storage object. */
for (var index = 0, length = CustomEventStorage.length; index < length; index++) {
/* Cache the record. */
var record = CustomEventStorage[index];
/* Check whether the given element exists. */
if (element == record.element) {
/* Return the record. */
return record;
}
}
/* Return false by default. */
return false;
}
Шаг 2. Затем вам понадобится функция, которая может добавить прослушиватель событий, а также добавить слушателя к объекту хранения.
/* The function that adds an event listener, while storing it in the storage object. */
function insertListener (element, event, listener, options) {
/* Use the element given to retrieve the record. */
var record = findRecordByElement(element);
/* Check whether any record was found. */
if (record) {
/* Normalise the event of the listeners object, in case it doesn't exist. */
record.listeners[event] = record.listeners[event] || [];
}
else {
/* Create an object to insert into the storage object. */
record = {
element: element,
listeners: {}
};
/* Create an array for event in the record. */
record.listeners[event] = [];
/* Insert the record in the storage. */
CustomEventStorage.push(record);
}
/* Insert the listener to the event array. */
record.listeners[event].push(listener);
/* Add the event listener to the element. */
element.addEventListener(event, listener, options);
}
Шаг 3: Что касается фактического для вашего вопроса вам понадобится следующая функция, чтобы проверить, был ли элемент добавлен прослушиватель событий для указанного события.
/* The function that checks whether an event listener is set for a given event. */
function listenerExists (element, event, listener) {
/* Use the element given to retrieve the record. */
var record = findRecordByElement(element);
/* Check whether a record was found & if an event array exists for the given event. */
if (record && event in record.listeners) {
/* Return whether the given listener exists. */
return !!~record.listeners[event].indexOf(listener);
}
/* Return false by default. */
return false;
}
Шаг 4: Наконец, вам понадобится функция, которая может удалить прослушиватель из объекта хранения.
/* The function that removes a listener from a given element & its storage record. */
function removeListener (element, event, listener, options) {
/* Use the element given to retrieve the record. */
var record = findRecordByElement(element);
/* Check whether any record was found and, if found, whether the event exists. */
if (record && event in record.listeners) {
/* Cache the index of the listener inside the event array. */
var index = record.listeners[event].indexOf(listener);
/* Check whether listener is not -1. */
if (~index) {
/* Delete the listener from the event array. */
record.listeners[event].splice(index, 1);
}
/* Check whether the event array is empty or not. */
if (!record.listeners[event].length) {
/* Delete the event array. */
delete record.listeners[event];
}
}
/* Add the event listener to the element. */
element.removeEventListener(event, listener, options);
}
Фрагмент:
window.onload = function () {
var
/* Cache the test element. */
element = document.getElementById("test"),
/* Create an event listener. */
listener = function (e) {
console.log(e.type + "triggered!");
};
/* Insert the listener to the element. */
insertListener(element, "mouseover", listener);
/* Log whether the listener exists. */
console.log(listenerExists(element, "mouseover", listener));
/* Remove the listener from the element. */
removeListener(element, "mouseover", listener);
/* Log whether the listener exists. */
console.log(listenerExists(element, "mouseover", listener));
};
<!-- Include the Custom Event Storage file -->
<script src = "https://cdn.rawgit.com/angelpolitis/custom-event-storage/master/main.js"></script>
<!-- A Test HTML element -->
<div id = "test" style = "background:#000; height:50px; width: 50px"></div>
Хотя прошло более 5 лет с тех пор, как ОП опубликовал вопрос, я считаю, что люди, которые наткнутся на него в будущем, извлекут выгоду из этого ответа, поэтому не стесняйтесь делать предложения или улучшения.
Возможный дубликат: Проверьте, есть ли у элемента прослушиватель событий. нет jquery . Пожалуйста, найдите мой ответ.
В принципе, вот трюк для браузера Chromium (Chrome):
getEventListeners(document.querySelector('your-element-selector'));
Я только что нашел это, пытаясь узнать, было ли мое событие прикреплено ....
, если вы это сделаете:
item.onclick
он вернет «null»
, но если вы это сделаете:
item.hasOwnProperty('onclick')
, то это «TRUE»
, поэтому я думаю, что когда вы используете addEventListener для добавления обработчиков событий, доступ к нему осуществляется через «hasOwnProperty». Хотел бы я знать, почему и как, но, увы, после исследования я не нашел объяснений.
То, что я сделал бы, это создать логическое значение вне вашей функции, которое начинается с FALSE и получает значение TRUE, когда вы присоединяете событие. Это послужит вам каким-то флагом, прежде чем вы присоедините это событие снова. Вот пример этой идеи.
// initial load
var attached = false;
// this will only execute code once
doSomething = function() {
if (!attached) {
attached = true;
//code
}
}
//attach your function with change event
window.onload = function() {
var txtbox = document.getElementById("textboxID");
if(window.addEventListener){
txtbox.addEventListener("change", doSomething, false);
} else if(window.attachEvent){
txtbox.attachEvent("onchange", doSomething);
}
}
Вот сценарий, который я использовал для проверки наличия динамически подключенного прослушивателя событий. Я использовал jQuery для присоединения обработчика события к элементу, а затем инициировал это событие (в данном случае событие «click»). Таким образом, я могу получить и захватить свойства событий, которые будут существовать только в том случае, если обработчик события присоединен.
var eventHandlerType;
$('#contentDiv').on('click', clickEventHandler).triggerHandler('click');
function clickEventHandler(e) {
eventHandlerType = e.type;
}
if (eventHandlerType === 'click') {
console.log('EventHandler "click" has been applied');
}
Я просто написал сценарий, который позволяет вам это достичь. Он дает вам две глобальные функции: hasEvent(Node elm, String event)
и getEvents(Node elm)
, которые вы можете использовать. Имейте в виду, что он изменяет метод прототипа EventTarget
add/RemoveEventListener
и не работает для событий, добавленных через HTML-разметку или синтаксис javascript для elm.on_event = ...
Дополнительная информация в GitHub
Сценарий:
var hasEvent,getEvents;!function(){function b(a,b,c){c?a.dataset.events+=","+b:a.dataset.events=a.dataset.events.replace(new RegExp(b),"")}function c(a,c){var d=EventTarget.prototype[a+"EventListener"];return function(a,e,f,g,h){this.dataset.events||(this.dataset.events="");var i=hasEvent(this,a);return c&&i||!c&&!i?(h&&h(),!1):(d.call(this,a,e,f),b(this,a,c),g&&g(),!0)}}hasEvent=function(a,b){var c=a.dataset.events;return c?new RegExp(b).test(c):!1},getEvents=function(a){return a.dataset.events.replace(/(^,+)|(,+$)/g,"").split(",").filter(function(a){return""!==a})},EventTarget.prototype.addEventListener=c("add",!0),EventTarget.prototype.removeEventListener=c("remove",!1)}();
Я сделал что-то вроде этого:
const element = document.getElementById('div');
if (element.getAttribute('listener') !== 'true') {
element.addEventListener('click', function (e) {
const elementClicked = e.target;
elementClicked.setAttribute('listener', 'true');
console.log('event has been attached');
});
}
Создание специального атрибута для элемента, когда слушатель подключен, а затем проверяет, существует ли он.
Вы могли бы в теории piggyback addEventListener и removeEventListener добавить удалить флаг в этот «объект». Ужасно и я не тестировал ...
Вы всегда можете проверить вручную, если ваш EventListener существует, например, с помощью инспектора Chrome. На вкладке Элемент у вас есть традиционная подкладка «Стили», а рядом с ней - «Слушатели событий». Это даст вам список всех EventListeners со связанными элементами.