التابع .select()
في jQuery
.select( handler )
القيم المعادة
يعيد كائنًا من النوع jQuery.
الوصف
يربط هذا التابع معالج حدث معين مع الحدث select
في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر.
.select( handler )
أُضيف مع الإصدار: 1.0.
handler
دالة من الشكل Function( Event eventObject )
، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث.
.select( [eventData ], handler )
أُضيف مع الإصدار: 1.4.3.
eventData
أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى إمكانيَّة استخدام أي نوع)، ويُمثِّل كائنًا يحتوي على البيانات التي ستُمرَّر إلى مُعالِج الأحداث.
handler
دالة من الشكل Function( Event eventObject )
، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث.
.select()
أُضيف مع الإصدار: 1.0، ولا يقبل هذا الشكل من التابع أي معلامات.
هذا التابع هو اختصار للتابع .on( "select", handler )
في شكله الأول والثاني، واختصار للتابع .trigger( "select" )
في شكله الثالث.
يُرسل الحدث select
إلى عنصرٍ عندما يحدِّد المستخدم نصًا ضمنه. يقتصر عمل هذا الحدث على الحقول <input type="text">
وعلى مربعات النصوص <textarea>
.
بفرض أن لدينا مثلًا شيفرة HTML التالية:
<form>
<input id="target" type="text" value="مرحبًا يا صديق">
</form>
<div id="other">
استدعِ معالج الحدث
</div>
يمكن أن يربط معالج الحدث يعنصر الإدخال النصي بالشكل:
$( "#target" ).select(function() {
alert( "استُدعي الحدث بنجاح" );
});
عندما يُحدَّد الآن أي جزء من النص داخل العنصر، فستظهر رسالة تنبيهٍ. الأمر الوحيد الذي لن يستدعي الحدث هو الضغط على أي موضع في الحقل النصي لإدراج أو لصق نص داخله. يمكن استدعاء الحدث يدويًا وذلك باستعمال .select()
دون أية وسائط:
$( "#other").click(function() {
$( "#target" ).select();
});
بعد تنفيذ هذه الشيفرة، ستظهر رسالة التنبيه أيضًا عند الضغط على "استدعِ معالج الحدث".
أضف إلى ذلك أنَّ السلوك الافتراضي للحدث select
عند إطلاقه هو تحديد جميع النصوص في الحقل النصي آنذاك.
يختلف التابع الذي يعيد النص المحدَّد الحالي من متصفح إلى آخر. توجد العديد من الإضافات في jQuery التي توفر حلولًا بديلة عبر المنصات.
ملاحظات إضافية
لما كان التابع .select()
اختزالٌ للتابع .on( "select", handler )
، فمن الممكن استعمال .off( "select" )
لإزالة الحدث select
أي عملية معاكسة لما سبق.
أمثلة
فعل أي شيء عندما يُحدَّد نصٌ في مربع الإدخال النصي:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>select مثالٌ عن استعمال التابع</title>
<style>
p {
color: blue;
}
div {
color: red;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>حدد أي جزء من النص في أحد مربعي الإدخال</p>
<input type="text" value="سلسلة نصية نريد تحديدها">
<input type="text" value="اختبار تحديد جزء من هذه السلسلة النصية">
<div></div>
<script>
$( ":input" ).select(function() {
$( "div" ).text( "هنالك شيء قد حُدِّد" ).show().fadeOut( 1000 );
});
</script>
</body>
</html>
من أجل استدعاء الحدث select
مع جميع عناصر الإدخال <input>
، جرب ما يلي:
$( "input" ).select();