التابع .keydown() في jQuery
.keydown( handler )
القيم المعادة
يعيد كائنًا من النوع jQuery.
الوصف
يربط هذا التابع معالج حدث معين مع الحدث keydown (الضغط على مفتاح في لوحة المفاتيح) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر.
.keydown( handler )
أُضيف مع الإصدار: 1.0.
handler
دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث.
.keydown( [eventData ], handler )
أُضيف مع الإصدار: 1.4.3.
eventData
أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى إمكانيَّة استخدام أي نوع)، ويُمثِّل كائنًا يحتوي على البيانات التي ستُمرَّر إلى مُعالِج الأحداث.
handler
دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث.
.keydown()
أُضيف مع الإصدار: 1.0، ولا يقبل هذا الشكل من التابع أي معلامات.
هذا التابع هو اختصار للتابع .on( "keydown", handler ) في شكله الأول والثاني، واختصار للتابع .trigger( "keydown" ) في شكله الثالث.
يُرسل الحدث keydown إلى عنصر عندما يضغط المستخدم على أي مفتاح من لوحة المفاتيح. في حال استمرار الضغط على المفتاح، فسيُرسل الحدث في كل مرة يستشعر نظام التشغيل فيها أنَّه ضُغط على المفتاح. رغم امكانية ارتباط الحدث مع أي عنصر إلا أنه لا يُرسل إلا إلى العنصر الذي استقبل التركيز (focus [المركز عليه حاليًا]). تختلف العناصر التي يمكن التركيز عليها باختلاف المتصفحات ولكن عناصر النماذج <form> يمكنها دومًا الحصول على التركيز، لذا هي من أهم العناصر المرشحة لاستعمالها مع هذا النوع من الحدث.
انظر مثلًا إلى شيفرة HTML التالية:
<form>
<input id="target" type="text" value="مرحبًا يا صديق">
</form>
<div id="other">
استدعِ الحدث
</div>
معالج الحدث يمكن أن يُربط مع حقل الإدخال:
$( "#target" ).keydown(function() {
alert( "Handler for .keydown() called." );
});
عندما يصبح الآن مؤشر الإدخال داخل الحقل، فإن الضغط على أي مفتاح سيُظهر التنبيه التالي:
Handler for .keydown() called.
استعمل لاستدعاء الحدث يدويًا التابع .keydown() دون أي معاملات:
$( "#other" ).click(function() {
$( "#target" ).keydown();
});
بعد تنفيذ هذه الشيفرة، ستظهر الرسالة السابقة بالضغط على "استدعِ الحدث".
إن أحتجت تحسُّس ضغط المفتاح في أي مكان في الصفحة (مثل استعمال مفاتيح اختصار عامة في الصفحة)، فاربط هذا السلوك مع الكائن document. بسبب توقف انتقال الأحداث (bubbling)، فإنَّ جميع ضغطات المفتاح ستسلك طريقها عبر شجرة DOM إلى الكائن document إلا إذا أُوقف هذا السلوك صراحةً.
إن أردت معرفة المفتاح الذي ضُغط، فافحص الكائن event المُمرَّر إلى دالة معالجة الحدث (handler). لما كانت المتصفحات تستعمل خاصيات مختلفة لتخزين هذه المعلومات، اعتمدت jQuery على ذلك لتسوية هذه المعضلة بتوفير الخاصية .which، لذا يمكنك استخدامها بكل ثقة لجلب رمز المفتاح المضغوط. يتطابق هذا الرمز مع أي مفتاح من لوحة المفاتيح من ضمنها المفاتيح الخاصة مثل الأسهم. يمكنك لمعرفة النص الحقيقي المقابل لرمز ذلك المفتاح استعمال التابع .keypress() فهو أفضل الخيارات المتوافرة حاليًا.
ملاحظات إضافية
لمَّا كان التابع .keydown() اختزالٌ للتابع .on( "keydown", handler )، فمن الممكن استعمال .off( "keydown" ) لإزالة الحدث keydown.
أمثلة
إظهار الكائن event لكل معالج keydown عند الضغط على أي مفتاح في حقل الإدخال:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>keydown مثالٌ عن الحدث</title>
<style>
fieldset {
margin-bottom: 1em;
}
input {
display: block;
margin-bottom: .25em;
}
#print-output {
width: 100%;
}
.print-output-line {
white-space: pre;
padding: 5px;
font-family: monaco, monospace;
font-size: .7em;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<form>
<fieldset>
<label for="target">اكتب شيئًا</label>
<input id="target" type="text">
</fieldset>
</form>
<button id="other">
استدعِ المعالج
</button>
<script type="text/javascript" src="/resources/events.js"></script>
<script>
var xTriggered = 0;
$( "#target" ).keydown(function( event ) {
if ( event.which == 13 ) {
event.preventDefault();
}
xTriggered++;
var msg = "Handler for .keydown() called " + xTriggered + " time(s).";
$.print( msg, "html" );
$.print( event );
});
$( "#other" ).click(function() {
$( "#target" ).keydown();
});
</script>
</body>
</html>