MouseTrap היא ספרייה ספרייה פשוטה לטיפול קיצורי מקשים ב- Javascript,
עצמאית וללא תלות חיצונית. שוקלת בסביבות 2KB מצומצם ומכווץ ו 4.5KB מוקטן.
להורדה לחץ כאן
המחלקה נבדקה ועובדת על הדפדפנים הבאים:
- Internet Explorer 6+
- Safari
- Firefox
- Chrome
ניתן באמצעותה להשתמש וללכוד לחיצה על מקש בודד או לחילופין צירוף של מקשים, לדוגמה לחצו על צרוף המקשים לפי הקוד הבא:
// single keys Mousetrap.bind('4', function() { highlight(2); });
Mousetrap.bind('x', function() { highlight(3); }, 'keyup');
// combinations Mousetrap.bind('command+shift+k',
function(e) { highlight([6, 7, 8, 9]); return false; });
Mousetrap.bind(['command+k', 'ctrl+k'], function(e) { highlight([11, 12, 13, 14]); return false; });
// gmail style sequences Mousetrap.bind('g i', function() { highlight(17); }); Mousetrap.bind('* a', function() { highlight(18); });
עבור מקשי אפשרויות אתה יכול להשתמש Shift, Ctrl, Alt, או meta.
אתה יכול להחליף אפשרות עבור מקש alt ואת הפקודה עבור meta.
מקשים מיוחדים נוספים הם backspace, tab, enter, return,
CapsLock, sc, escape, space, Pageup, PageDown, end, home, left, up, right, down ו plus
ובנוסף אתה אמור להיות מסוגל להפנות כל מקש אחר לפי שם כמו, /, $, *, או =.
Mousetrap.bind
bind היא הפונקציה הראשית בה נשתמש על מנת לקשר בין מקש במקלדת לבין פונקציה או אירוע בקוד,
לדוגמה:
Mousetrap.bind('/', _focusSearch);
ניתן לקשר גם צרוף מקשים ולא רק מקש בודד, לדוגמה:
Mousetrap.bind('ctrl+s', function(e) { _saveDraft(); });
אם נרצה לקשר מספר מקשים או מספר צירופים לפקודה אחת, נחתן לעשות זאת הצורה הבאה:
Mousetrap.bind(['ctrl+s', 'command+s'], function(e) { _saveDraft(); });
בגרסה 1.4 נוספה תמיכה חוצה פלטפורמות עבור שימוש בצרופי מקשים על ידי שימוש ב mod,
לצורך העניין בחלונות נשתמש ב ctrl+s ובמקינטוש ב command+s:
Mousetrap.bind('mod+s', _saveDraft);
הקלדה רציפה (רצף הקלדה):
תכונה זו נוספה בהשראת Gmail. הקשה. אם תקליד על המקשים אחר אחרי השני ברצף עד האחרון
הפקודה תתבצע. במידה ותקליד שלא לפי הרצף או בהפרש זמן ארוך בין מקש למקש הרצף יתאפס, לדוגמה:
Mousetrap.bind('* a', _selectAll, 'keydown');
ניתן להשתמש גם ברצף הכולל צירופי מקשים בתוכו:
Mousetrap.bind('g o command+enter', function() { /* do something */ });
Leave a Reply