контекстное меню Safai / OSX закрывается нажатием на открывшееся окно

Question

У меня есть контекстное меню над полями, например для копирования / вырезания / вставки, которая работает должным образом с Chrome и IE в Windows, но в Safari (OSX) это не так. Появляется контекстное меню, но как только я отпускаю щелчок мыши (над окном или нет), он скрывается, и щелчки по его <li> s не фиксируются.

Я подозреваю, что происходит то, что первоначальный щелчок (управляющий щелчок?) События contextmenu передается в $ (документ) и затем закрывается. Вот соответствующие части кода. Спасибо за любую помощь!

<select class="mySelectionsSelects"></select>
<select class="mySelectionsSelects"></select>

<ul id="custom-menu" style="top: 194px; left: 884px; display: none;">
  <li id="customMenuCopy" data-action="copy">Copy</li>
  <li id="customMenuCut" data-action="cut">Cut</li>
  <li id="customMenuPaste" data-action="paste">Paste</li>
</ul>

обработка событий:

jQuery(document).ready(function ($) {
 $('.mySelectionsSelects').on("contextmenu", function(event) { 
   event.preventDefault(); event.stopPropagation();
   console.log('building context menu');
   $("#custom-menu").css({"top": event.pageY + "px", "left": event.pageX +    "px"});
   $("#custom-menu").show();
   console.log('added context menu at top: ' + event.pageY + '/left: ' +    event.pageX);
 });

// catch click anywhere else, to close it.
$(document).on("click", function(event) {
  console.log('caught click on document, hiding custom-menu');
  $("#custom-menu").hide();
});

$("#custom-menu li").on("click", function(event) {
  event.preventDefault(); event.stopPropagation();
  console.log('caught click in li'); 
  // This is the triggered action name
  switch($(this).attr("data-action")) {
    case "copy": editButton.doCopy(); break;
    case "cut": editButton.doCut(); break;
    case "paste": editButton.doPaste(); break;
  };
  // Hide it AFTER the action was triggered
  $("#custom-menu").hide(100);    
 });
});

CSS:

#custom-menu {
    display: none;
    z-index: 1000;
    position: absolute;
    overflow: hidden;
    border: 1px solid #CCC;
    white-space: nowrap;
    font-family: "Open Sans", sans-serif;
    font-size: 10pt;
    background: #FFF;
    color: #333;
    border-radius: 5px;
    padding: 0;
}

#custom-menu li {
    padding: 6px 9px;
    cursor: pointer;
    list-style-type: none;
    transition: all .3s ease;
    user-select: none;
}

#custom-menu li:hover {
  background-color: #DEF;
}

Answer 1

Ваше подозрение верно! Добавьте эту строку в начале вашей функции закрытия контекстного меню:

if (event.ctrlKey) return;

Источник: https://stackoverflow.com/a/27973894/7503963 (у меня не было представителя, чтобы просто комментировать.)