vue.js 通过使用JavaScript在浏览器中发送ESC键来关闭Modal

7dl7o3gd  于 2023-05-01  发布在  Vue.js
关注(0)|答案(2)|浏览(126)

所有模态可以关闭使用按esc键由人。我想通过javascript代码做到这一点,而没有实际的人为干预我通过浏览器控制台运行以下代码,但它根本不起作用有人能解决我的问题吗?

document.dispatchEvent(new KeyboardEvent('keydown', {'key': 'Escape'}));

要进行测试,可以转到the link并测试

fwzugrvs

fwzugrvs1#

这对我很有效

document.getElementById('myModal').dispatchEvent(new KeyboardEvent("keydown",{
        keyCode: 27,
        which: 27,
        key: 'Escape',
        code: 'Escape'
     }));
at0kjp5o

at0kjp5o2#

也许这会有用。

<!-- HTML code for the Bootstrap modal -->
<div class="modal" id="myModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <!-- Modal header, body, and footer content here -->
    </div>
  </div>
</div>

<!-- JavaScript code to listen for the escape key press -->
<script>
document.addEventListener('keydown', function(event) {
  if (event.key === "Escape") {
    var modal = document.getElementById("myModal");
    if ($(modal).data('bs.modal')._isShown) {
      $(modal).modal('hide');
    }
  }
});
</script>

相关问题