Click eventlistener запускается при нажатии на другие элементы внутри этого div [duplicate]

В соответствии с этой страницей в IE вам нужно:

event.cancelBubble = true

Имейте в виду, что window.event не поддерживается в FireFox, поэтому он должен быть чем-то вроде:

e.cancelBubble = true

Или вы можете использовать стандарт W3C для FireFox:

e.stopPropagation();

Если вы хотите получить фантазию, вы можете сделать это:

function myEventHandler(e)
{
    if (!e)
      e = window.event;

    //IE9 & Other Browsers
    if (e.stopPropagation) {
      e.stopPropagation();
    }
    //IE8 and Lower
    else {
      e.cancelBubble = true;
    }
}

Почему бы просто не проверить, какой элемент был нажат? Если вы нажмете на что-нибудь, window.event.target присваивается элементу, который был нажат, а щелкнутый элемент также может быть передан в качестве аргумента.

и

function myfunc(el){
  if (window.event.target === el){
      // perform action
  }
}
<div onclick="myfunc(this)" />

Для веб-страниц ASP.NET (не MVC) вы можете использовать объект Sys.UI.DomEvent в качестве оболочки собственного события.

<div onclick="event.stopPropagation();" ...

или передать событие как параметр для внутренней функции:

<div onclick="someFunction(event);" ...

и в некоторой функции:

function someFunction(event){
    event.stopPropagation(); // here Sys.UI.DomEvent.stopPropagation() method is used
    // other onclick logic
}

Есть два способа получить объект события изнутри функции:

Если вам необходимо поддерживать устаревшие браузеры, которые не следуют рекомендациям W3C, как правило, внутри функции вы должны использовать что-то вроде следующего:

function(e) {
  var event = e || window.event;
  [...];
}

, который будет проверять первый, а затем другой и сохранить в зависимости от того, что было найдено внутри переменной события. Однако в обработчике событий inline не используется объект e. В этом случае вы должны использовать коллекцию arguments, которая всегда доступна, и ссылается на полный набор аргументов, переданных функции:

onclick="var event = arguments[0] || window.event; [...]"

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

Это сработало для меня

<script>
function cancelBubble(e) {
 var evt = e ? e:window.event;
 if (evt.stopPropagation)    evt.stopPropagation();
 if (evt.cancelBubble!=null) evt.cancelBubble = true;
}
</script>

<div onclick="alert("Click!")">
  <div onclick="cancelBubble(event)">Something inside the other div</div>
</div>

У меня была такая же проблема: js error box в IE - это прекрасно работает во всех браузерах, насколько я могу видеть (event.cancelBubble = true выполняет задание в IE)

onClick="if(event.stopPropagation){event.stopPropagation();}event.cancelBubble=true;"

Это также работает. В ссылке HTML используйте onclick с возвратом так:

<a href="mypage.html" onclick="return confirmClick();">Delete</a>

И тогда функция comfirmClick () должна выглядеть как:

function confirmClick() {
    if(confirm("Do you really want to delete this task?")) {
        return true;
    } else {
        return false;
    }
};

Используйте эту функцию, она проверит наличие правильного метода.

function disabledEventPropagation(event)
{
   if (event.stopPropagation){
       event.stopPropagation();
   }
   else if(window.event){
      window.event.cancelBubble=true;
   }
}