เป็นไปได้ไหมที่จะตั้งค่าแป้นพิมพ์ลัดบนหน้าเว็บ

ไม่ใช่ปุ่มลัดของระบบหรือแอปพลิเคชัน แต่ใช้แป้นพิมพ์ลัดบนหน้าเว็บบางหน้าโดยเฉพาะ

ทางลัด Gmail เช่น

ตัวอย่าง:

กดAlt+ fขณะที่อยู่บน Facebook มันจะเปลี่ยนฟีดจาก 'เรื่องเด่น' เป็น 'ล่าสุดที่สุด' และในทางกลับกัน

และอนุญาตให้ผู้ใช้ตั้งค่าทางลัดเหล่านี้ด้วยตนเองหรือไม่ อาจจะเป็นส่วนขยายของโครเมี่ยม?

ส่วนขยายทางลัดผู้จัดการช่วยให้คุณสร้างแป้นพิมพ์ลัดที่กำหนดเอง แต่การดำเนินการภายในหน้าต้องใช้ความรู้เล็ก ๆ น้อย ๆ ใน JavaScript หรืออย่างน้อยjQuery Selectors

คำอธิบายอย่างเป็นทางการ

ปรับแต่งปุ่มลัด; กำหนดรหัส Javascript หรือการกระทำของเบราว์เซอร์ให้กับการกดปุ่มใดก็ได้

คุณสามารถเปลี่ยนปุ่มลัดเริ่มต้นของเบราว์เซอร์และกำหนด bookmarklet หรือการกระทำ Javascript ให้กับปุ่มลัดของคุณ มันทำงานเป็น Keyconfig บน Firefox

ตัวอย่างการกระทำ:

• แท็บ: "แท็บด้านซ้าย", "ไดเรกทอรีด้านบน", "ปิดแท็บด้านขวา", "เปิดหน้าโปรดของคุณ", ...
• หน้า: "เลื่อนขึ้น / ลง", "แทรกลายเซ็นของคุณ", ...
• พิเศษ: "จับภาพหน้าจอ"
• กำหนดเอง: ดำเนินการ Bookmarklets หรือรหัส Javascript ใด ๆ !

คุณสามารถนำเข้าหรือส่งออกการตั้งค่าของคุณเพื่อให้คุณสามารถแบ่งปันกับผู้อื่นได้

การติดตั้ง

1. เยี่ยมชมผู้จัดการทางลัด
2. คลิกเพิ่มใน Chrome
3. คลิกAdd

ตัวอย่าง

ฉันไม่มีบัญชี Facebook ดังนั้นเรามาเปิดกล่องจดหมาย Super User โดยใช้แป้นพิมพ์ลัด

1. คลิกที่ไอคอนตัวจัดการทางลัดที่ด้านขวาของแถบอเนกประสงค์

2. คลิกดูการตั้งค่าทั้งหมด / เพิ่มทางลัดใหม่

3. คลิกที่ช่องป้อนข้อมูลปุ่มทางลัดและกดปุ่มผสมที่ต้องการ

   นี้สามารถเป็นได้ทั้งทางลัดหลายปุ่มเดียว (เช่นCtrl+ Shift+ IหรือAlt+ I) หรือลำดับของคีย์ (เช่นI, N, B, O, X)

4. เลือกที่เหมาะสมรูปแบบ URL

   หากต้องการจับคู่ทุกหน้าของโดเมนsuperuser.comและโดเมนย่อยให้ใช้:

   *://superuser.com/*
   *://*.superuser.com/*
   

5. ในการดำเนินการเลือกเรียกใช้Javascriptและป้อน

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

   ใน(1)

6. ใส่เปิดกล่องจดหมายในรายละเอียด

7. เราสามารถใช้.click()วิธีการของจาวาสคริปต์ในการจำลองการคลิกเมาส์บนรายการใด ๆ ของหน้าเว็บ ส่วนที่ยากคือการเข้าถึงรายการเหล่านั้น นี่คือสิ่งที่ตัวเลือก jQuery ใช้งานได้สะดวก

   โดยปกติในการเข้าถึงกล่องจดหมายของคุณที่คุณต้องการคลิกที่StackExchangeแบบเลื่อนลงแล้วกล่องจดหมาย เราต้องการเครื่องมือเลือกที่เหมาะสมสำหรับทั้งคู่

   • คลิกขวาที่StackExchangeแบบเลื่อนและคลิกตรวจสอบธาตุ

     คุณจะเห็นสิ่งต่อไปนี้ในเครื่องมือสำหรับนักพัฒนา:

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

     <a>แท็กเป็นไฮไลต์; นี่คือองค์ประกอบที่เราต้องการจำลองการคลิก

     ชั้นขององค์ประกอบคือGenu เราสามารถใช้เครื่องมือเลือก.genuได้ แต่มันไม่สามารถทำงานได้อย่างถูกต้องหากมีหลายองค์ประกอบในคลาสเดียวกัน วิธีการที่เชื่อถือได้มากขึ้นที่จะเข้าถึงมันเป็นโหนดลูกของ<div>ที่มี ID portalLink (ของ ID ที่ไม่ซ้ำกัน) #portalLink a.genuโดยใช้ตัวเลือก จากนั้นเราใช้.click()วิธีการ

     การป้อนบรรทัดต่อไปนี้ใน(2)จะทำงาน:

     // 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();});
     

   • ในStackExchangeแบบเลื่อนลงคลิกขวากล่องจดหมายและคลิกตรวจสอบธาตุ

     คุณจะเห็นสิ่งต่อไปนี้ในเครื่องมือสำหรับนักพัฒนา:

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

     องค์ประกอบนี้มีรหัสของตัวเอง: seTabInbox

     การป้อนบรรทัดต่อไปนี้ใน(2)จะทำงาน:

     // click first (only) element with ID `seTabInbox'
     $('#seTabInbox')[0].click();
     
     // click sixth <a> element of the entire page (unreliable)
     $('a')[5].click();
     

8. คลิกบันทึกและโหลดหน้าผู้ใช้ขั้นสูงทั้งหมดที่เปิดใหม่ ทางลัดของคุณพร้อมใช้งานแล้ว

ให้การอ่าน ( ลิงก์ ) นี้ไม่ยากมากแม้ว่าคุณจะต้องเปิดเบราว์เซอร์ -