У меня есть воспроизводимая ошибка здесь, где я запускаю Uncaught RangeError: Maximum call stack size exceeded
Это просто событие click, которое я вызываю по ссылке.
Мой HTML:
<div id="box">
<a href="#">test</a>
</div>
Мой Javascript:
$('#box').click(function() {
("a", $(this)).click();
});
Теперь нажатие #box приводит к ошибке.
Вы должны остановить распространение stopImmediatePropagation(), в противном случае у вас слишком много rcursion
$('#box').click(function() {
$("a:first", this).click();
});
$('a').click(function(e){
e.stopImmediatePropagation();
alert('hi');
});
скрипт http://jsfiddle.net/DMAMv/8/
Это потому, что он рекурсивно запускает событие click. Это вызвано двумя проблемами.
Первая - это невиновная линия:
("a", $(this)).click(); # note the missing $ at the beginning
Это существенно сокращается до $(this).click() (потому что оператор запятой оценивает оба операнда и возвращает второй), и поэтому событие click на #container запускает сам. Рассмотрим следующие примеры: http://jsfiddle.net/2VnbG/ и http://jsfiddle.net/2VnbG/1/ - обратите внимание, как родительский div задан, когда $ отсутствует.
Подготовьте строку с отсутствующим $, чтобы решить эту проблему, т.е. $("a", $(this)).click();
Следующая проблема заключается в том, что событие click на якоре будет пузыриться до родительского объекта (в вашем случае #container). Если родительский объект имеет связанную функцию в событии клика, которое запускает новое событие, цикл будет повторяться бесконечно.
Чтобы решить эту проблему, используйте event.stopPropagation(), чтобы остановить событие от пузырьков дерева DOM.
Вот пример с приведенными выше исправлениями: http://jsfiddle.net/DMAMv/9/
mine был элементом списка в выпадающем списке, поэтому я хотел, чтобы событие продолжало пузыряться, поэтому выпадающее меню будет закрыто. это решение, которое я использовал:
$('div#outer').click(function (e) {
if (e.target == e.currentTarget) // prevents bubbled events from triggering
$($(e.currentTarget).children()[0]).trigger('click');
});