Làm thế nào để một người nắm bắt khóa lệnh của Mac thông qua JavaScript?

Làm thế nào để một người nắm bắt Cmdkhóa của Mac thông qua JavaScript?

EDIT: Kể từ năm 2019, e.metaKeyđược hỗ trợ trên tất cả các trình duyệt chính theo MDN .

Lưu ý rằng trên Windows, mặc dù ⊞ Windowskhóa được coi là khóa "meta", nhưng nó sẽ không bị bắt bởi các trình duyệt như vậy.

Điều này chỉ dành cho phím lệnh trên MacOS / bàn phím.

Không giống như Shift/ Alt/ Ctrl, Cmdthay vào đó, phím (Apple Apple) không được coi là khóa sửa đổi, bạn nên lắng nghe keydown/ keyupvà ghi lại khi nhấn phím và sau đó nhấn phím event.keyCode.

Thật không may, các mã khóa này phụ thuộc vào trình duyệt:

• Firefox: 224
• Opera: 17
• Trình duyệt WebKit (Safari / Chrome): 91(Lệnh trái) hoặc 93(Lệnh phải)

Bạn có thể thích đọc bài viết JavaScript Madness: Bàn phím Sự kiện , từ đó tôi học được kiến ​​thức đó.

Bạn cũng có thể xem event.metaKeythuộc tính trên sự kiện nếu bạn đang làm việc với các sự kiện keydown. Làm việc tuyệt vời cho tôi! Bạn có thể thử nó ở đây .

Tôi thấy rằng bạn có thể phát hiện khóa lệnh trong phiên bản Safari mới nhất (7.0: 9537.71) nếu nó được nhấn cùng với một phím khác. Ví dụ: nếu bạn muốn phát hiện + x:, bạn có thể phát hiện khóa x VÀ kiểm tra xem event.metaKey có được đặt thành true không. Ví dụ:

var key = event.keyCode || event.charCode || 0;
console.log(key, event.metaKey);

Khi nhấn x trên chính nó, điều này sẽ xuất ra 120, false. Khi nhấn + x, nó sẽ xuất ra120, true

Điều này dường như chỉ hoạt động trong Safari - không phải Chrome

Dựa trên dữ liệu của Ilya, tôi đã viết thư viện Vanilla JS để hỗ trợ các khóa sửa đổi trên Mac: https://github.com/MichaelZelensky/jsLologists/blob/master/macKeys.js

Chỉ cần sử dụng nó như thế này, ví dụ:

document.onclick = function (event) {
  if (event.shiftKey || macKeys.shiftKey) {
    //do something interesting
  }
}

Đã thử nghiệm trên Chrome, Safari, Firefox, Opera trên Mac. Vui lòng kiểm tra nếu nó làm việc cho bạn.

Đối với những người sử dụng jQuery, có một plugin tuyệt vời để xử lý các sự kiện chính:

Các phím nóng jQuery trên GitHub

Để chụp ⌘+ Svà Ctrl+ STôi đang sử dụng:

$(window).bind('keydown.ctrl_s keydown.meta_s', function(event) {
    event.preventDefault();
    // Do something here
});

Đây là cách tôi đã làm trong AngularJS

app = angular.module('MM_Graph')

class Keyboard
  constructor: ($injector)->
    @.$injector  = $injector
    @.$window    = @.$injector.get('$window')                             # get reference to $window and $rootScope objects
    @.$rootScope = @.$injector.get('$rootScope')

  on_Key_Down:($event)=>
    @.$rootScope.$broadcast 'keydown', $event                             # broadcast a global keydown event

    if $event.code is 'KeyS' and ($event.ctrlKey or $event.metaKey)       # detect S key pressed and either OSX Command or Window's Control keys pressed
      @.$rootScope.$broadcast '', $event                                  # broadcast keyup_CtrS event
     #$event.preventDefault()                                             # this should be used by the event listeners to prevent default browser behaviour

  setup_Hooks: ()=>
    angular.element(@.$window).bind "keydown", @.on_Key_Down              # hook keydown event in window (only called once per app load)
    @

app.service 'keyboard', ($injector)=>
  return new Keyboard($injector).setup_Hooks()

Nếu bạn sử dụng Vuejs, chỉ cần tạo nó bằng plugin vue-shortkey, mọi thứ sẽ đơn giản

https://www.npmjs.com/package/vue-shortkey

v-shortkey="['meta', 'enter']"·
@shortkey="metaEnterTrigged"