Apakah mungkin untuk mengatur pintasan keyboard di halaman web?

7

Bukan pintasan sistem atau aplikasi, tetapi pintasan keyboard yang digunakan khusus pada laman web tertentu.

Pintasan Gmail misalnya.

Contoh:

Tekan Alt+ fsaat di Facebook itu akan mengubah umpan dari 'Top Stories' ke 'Most Recent' dan sebaliknya.

Dan izinkan pengguna untuk mengatur pintasan ini sendiri? Mungkin ekstensi chrome?

juil
sumber
Apakah maksud Anda pintasan keyboard hanya untuk laman web tertentu, seperti menambahkan makro untuk melakukan hal-hal di jendela gmail? Atau Anda ingin pintasan yang akan membawa Anda ke (misalnya) gmail ketika Anda menekan perintah kunci di mana saja di Chrome?
Marcus Chan
@MarcusChan Yang pertama. Misalnya, jika saya menekan altDsaat di Facebook, secara otomatis akan menghapus semua pemberitahuan baru. Dan minta pengguna mengatur pintasan ini sendiri.
juil
Jika Anda mengedit pertanyaan Anda untuk lebih spesifik tentang apa yang ingin Anda lakukan, kami dapat mengajukan petisi agar pertanyaan itu tidak ditutup.
Marcus Chan
@marcus Jadi saya sudah mengedit pertanyaan, dan saya pikir cukup jelas ketika saya menyebutkan pintasan Gmail, tentang apa yang saya bicarakan.
remaja
Anda dapat menulis skrip pengguna sendiri. Saya dapat membantu Anda menggunakan contoh Facebook, tetapi karena saya tidak memiliki akun Facebook, saya harus bertanya: Apa yang biasanya Anda lakukan untuk menghapus semua pemberitahuan?
Dennis

Jawaban:

7

Ekstensi Shortcut Manager memungkinkan Anda membuat pintasan keyboard khusus, tetapi melakukan tindakan halaman dalam membutuhkan sedikit pengetahuan dalam JavaScript atau setidaknya jQuery Selectors .

Deskripsi resmi

Kustomisasi tombol pintasan; Tetapkan kode Javascript atau tindakan peramban apa pun untuk penekanan tombol apa pun.

Anda dapat mengubah tombol cara pintas default browser, dan menetapkan bookmarklet atau tindakan Javascript untuk hotkey Anda. Ini berfungsi sebagai Keyconfig di Firefox.

Contoh tindakan:

  • Tab: "Tab Kiri", "Direktori atas", "Tutup tab kanan", "Buka halaman favorit Anda", ...
  • Halaman: "Gulir ke atas / bawah", "Masukkan tanda tangan Anda", ...
  • Spesial: "Tangkapan Layar"
  • Kustom: Jalankan Bookmarklets atau kode Javascript apa pun!

Anda juga dapat mengimpor atau mengekspor pengaturan Anda sehingga Anda dapat membagikannya dengan orang lain.

Instalasi

  1. Kunjungi Shortcut Manager .
  2. Klik Tambahkan ke Chrome .
  3. Klik Tambah .

Contoh

Saya tidak memiliki akun Facebook, jadi mari kita buka kotak masuk Pengguna Super menggunakan pintasan keyboard.

  1. Klik ikon Shortcut Manager di sebelah kanan mahakotak.

  2. Klik Lihat semua pengaturan / Tambahkan pintasan baru .

  3. Klik pada bidang input tombol pintas dan tekan kombinasi tombol yang diinginkan.

    Hal ini dapat berupa multi-tombol pintas tunggal (misalnya, Ctrl+ Shift+ Iatau Alt+ I) atau urutan kunci (misalnya, I, N, B, O, X).

  4. Pilih pola URL yang sesuai .

    Untuk mencocokkan semua halaman domain superuser.comdan subdomainnya, gunakan:

    *://superuser.com/*
    *://*.superuser.com/*
    
  5. Di Action , pilih Execute Javascript dan masukkan

    http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
    

    dalam (1) .

  6. Masukkan Buka kotak masuk di Deskripsi .

  7. Kita dapat menggunakan .click()metode JavaScript untuk mensimulasikan klik mouse pada setiap item halaman web. Bagian yang sulit adalah mengakses barang-barang itu. Di sinilah penyeleksi jQuery berguna.

    Biasanya, untuk mengakses kotak masuk Anda, Anda akan mengklik dropdown StackExchange , lalu kotak masuk . Kami membutuhkan penyeleksi yang tepat untuk keduanya.

    • Klik kanan dropdown StackExchange dan klik Periksa Elemen .

      Anda akan melihat yang berikut ini di alat pengembang:

      <div id="header">
          <div id="portalLink">
              <a class="genu" onclick="StackExchange.ready(function(){genuwine.click();});return false;">Stack Exchange</a>
              </div>
              ...
      </div>
      

      The <a>tag disorot; ini adalah elemen tempat kami ingin mensimulasikan klik.

      Kelas elemen adalah genu . Kita bisa menggunakan pemilih .genu, tetapi itu tidak akan berfungsi dengan baik jika ada beberapa elemen dari kelas yang sama. Pendekatan yang lebih andal adalah mengaksesnya sebagai simpul anak dari <div>dengan ID portalLink (ID unik), menggunakan pemilih #portalLink a.genu. Kemudian, kami menggunakan .click()metode.

      Memasukkan salah satu dari baris berikut dalam (2) akan melakukan pekerjaan:

      // click first <a> element with class `genu'
      // inside the element with ID `portalLink'
      $('#portalLink a.genu')[0].click();
      
      // click first <a> element with class `genu'
      // inside the element with ID `header'
      $('#header a.genu')[0].click();
      
      // click first element with class `genu' of the entire page
      $('.genu')[0].click();
      
      // click first <a> element of the entire page (unreliable)
      $('a')[0].click();
      
      // directly perform the onclick event (easy, but not always available)
      StackExchange.ready(function(){genuwine.click();});
      
    • Dalam dropdown StackExchange , klik kanan inbox dan klik Inspect Element .

      Anda akan melihat yang berikut ini di alat pengembang:

      <a id="seTabInbox" class="seCurrent">Inbox</a>
      

      Elemen ini memiliki ID sendiri: seTabInbox .

      Memasukkan salah satu dari baris berikut dalam (2) akan melakukan pekerjaan:

      // click first (only) element with ID `seTabInbox'
      $('#seTabInbox')[0].click();
      
      // click sixth <a> element of the entire page (unreliable)
      $('a')[5].click();
      
  8. Klik Simpan dan muat ulang semua halaman Super User yang terbuka. Pintasan Anda siap digunakan.

Dennis
sumber
1
URL memberikan 404
Kev
1
Untuk Shortcut Manager, yaitu
Kev
-1

Coba baca ini ( Tautan ), itu tidak terlalu sulit walaupun Anda harus membuka browser-

Karan Raj Baruah
sumber
2
Seperti yang saya nyatakan dalam pertanyaan saya. Saya berbicara tentang cara pintas keyboard di halaman web, bukan ke situs web.
juil