Как я могу мешать onclick событию стрелять для родительского элемента, когда ребенок нажат?

Для вашего первого вопроса: IE не поддерживает stopPropagation () , вместо этого вы должны использовать e.cancelBubble = true . Просто сначала проверьте функцию, чтобы узнать, какой метод вам следует использовать ( if (e.stopPropagation) {code} ).

По второму вопросу: возможно, добавьте второй div, который обрабатывает событие клика ?

<div><img src="image.jpg"/></div>
<div style="position:absolute" onclick="doSomething();"></div>

, а затем правильно разместите второй div

Что касается второго вопроса, вы можете получить координаты указателя, когда произошло событие щелчка, и сравнить их с координатами div. (фактическая реализация зависит от того, какую библиотеку js вы используете)

Для вашего первого вопроса, чтобы остановить всплытие события, вы должны использовать

event.cancelBubble = true;
if(event.stopPropagation) event.stopPropagation();

Вам нужно остановить распространение. Для этого можно использовать jQuery: Остановка распространения .

Во-вторых, вы можете поместить свой div перед изображением и не иметь тегов изображения внутри div. Это должно дать вам необходимую функциональность.

Я не уверен, является ли ваш первый упрощением или нет. Если это именно то, что есть, я бы просто удалил onClick из div.

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

Во втором случае я бы фактически разделил изображение на пять частей и поместил бы только одну из них в div, как показано ниже:

+------------------------------------------------------+
|                     Image part 1                     |
+------------------------------------------------------+
| Image part 2 | Image part 3 (and div) | Image part 4 |
+------------------------------------------------------+
|                     Image part 5                     |
+------------------------------------------------------+

Клуджи, я знаю,

Для первого попробуйте также использовать e.preventBubble () и вернуть false из обработчика.

Во втором случае вы можете зафиксировать щелчок и проверить цель события. Это проще всего, если вы используете какую-то библиотеку, которая нормализует события, например jQuery, где e.target возвращает вам точный элемент, для которого было запущено событие. Другой вариант - поместить обработчик кликов не на изображение, а на любой контейнер, в котором вы переполняете изображение.

Помимо или в качестве альтернативы прекращению захвата восходящей цепочки, каждая из ваших функций событий должна иметь некоторый код, который проверяет, что щелкнул правильный элемент , используйте event.target или event.scrElement в IE, чтобы найти выбранный элемент.