无法触发jQuery中的事件

Question

我想在音频元素上的jQuery中触发上下文菜单事件。 这是代码：

$("audio").contextmenu();

但是，这不会显示该元素的上下文菜单。 我认为可能需要一些用户交互，因此我将其包装在一个moueenter事件中。

$("audio").on("mouseenter", function(e) {
   $(this).contextmenu();
}

但是，上下文菜单仍然不会出现。 最后，我决定手动在音频元素上单击鼠标右键并触发按键事件，但它似乎也无能为力。

$("audio").on("contextmenu", function(e) {
  var code = 86;
  $(this).trigger(
    jQuery.Event( 'keydown', { keyCode: code, which: code } )
  );
});

该代码段应该在按下“ v”时触发jQuery按键事件。

当我们右键单击音频元素并按“ v”时，它将显示一个“将音频另存为”对话框。 我想编写代码以触发上下文菜单并以编程方式按键，但是它们似乎都没有作用。 这是为什么？

Answer 1

您可以触发音频元素上的右键菜单，但前提是您右键单击它。 确保将“ controls”属性添加到您的音频元素，以便单击某些内容。 在下面的代码上尝试一下。

 $("audio").on("contextmenu", function(e) { alert("Hello Context Menu!"); }); $("button").on("click", function(){ $("audio").contextmenu(); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <audio id="t-rex-roar" controls src="https://soundbible.com/mp3/Tyrannosaurus%20Rex%20Roar-SoundBible.com-807702404.mp3"> </audio> <button>Call Context Menu Event for Audio Element, Event only</button> 

但是 ，您不能添加显示另一个元素的上下文菜单的按钮单击事件。 以编程方式调用浏览器的右键单击菜单选项？