Событие jQuery Click не работает в Mozilla (работает в Chrome)

Question

Я знаю, что это было задано здесь раньше, потому что я помню, как читал разные сообщения по этой теме, когда я впервые попытался воссоздать этот эффект на моем личном веб-сайте. Это, как говорится, я не могу найти эти должности для жизни меня на этот раз. Я должен был бы сэкономить их>:/

Итак, прошу прощения за дубликат, но я пытаюсь сделать один из этих «щелчков где-нибудь, НО здесь, чтобы закрыть наложение элементов». Прекрасно работает в Chrome, но не так много в Mozilla. В довершение всего, другие элементы, которые я использовал для этого, отлично работают (как в Mozilla, так и в Chrome), а не в этом.

JQuery

function closeProductOverlay() { 
    if (!$(event.target).closest('#clickControl').length) { 
     $('#productOverlay').toggle('fast', 'linear'); 
    } 
} 

HTML

<div id="productOverlay" style="display:none;" onclick="closeProductOverlay()"> 
    <div id="mobiPadding"> 
     <div id="productContainer"> 
      <div id="clickControl"> 
       <!-- This is where I populate items dynamically --> 
      </div> 
     </div> 
    </div> 
</div> 

Как я уже говорил, я применил эту концепцию ко многим функциям в течение того же проекта/веб-сайт, и все они работают безупречно. Я нахожусь на своем пути, пытаясь диагностировать это.

Я пробовал несколько грязных «исправлений», но никто из них не работает так, как они предназначены. Ближайший я получил, если удалить, если заявление так:

JQuery

function closeProductOverlay() { 
    $('#productOverlay').toggle('fast', 'linear'); 
} 

Но тогда, очевидно, если вы нажмете ВЕЗДЕ, наложение уходит. (Даже если вы нажимаете кнопки или пытаетесь скопировать текст). Это очень раздражает и не работает так, как мне нужно.

Answer 1

event не является глобальным в Firefox, как в IE или Chrome.

Одно решение изменить функцию передать событие в него:

function closeProductOverlay(event) { 

И изменить связывание:

<div id="productOverlay" style="display:none;" onclick="closeProductOverlay(event)">