https://wiki.hsoub.com/index.php?title=jQuery/one&feed=atom&action=historyjQuery/one - تاريخ المراجعة2024-03-28T23:40:29Zتاريخ التعديل لهذه الصفحة في الويكيMediaWiki 1.35.0https://wiki.hsoub.com/index.php?title=jQuery/one&diff=10798&oldid=prevجميل-بيلوني في 17:44، 13 يونيو 20182018-06-13T17:44:31Z<p></p>
<table class="diff diff-contentalign-right diff-editfont-monospace" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="ar">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">→ مراجعة أقدم</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">مراجعة 17:44، 13 يونيو 2018</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l143" >سطر 143:</td>
<td colspan="2" class="diff-lineno">سطر 143:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://api.jquery.com/one/ صفحة التابع .one() في توثيق jQuery الرسمي.]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://api.jquery.com/one/ صفحة التابع .one() في توثيق jQuery الرسمي.]</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>[[تصنيف:jQuery]]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>[[تصنيف:jQuery]]</div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">[[تصنيف:jQuery Method]]</ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>[[تصنيف:jQuery Events]]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>[[تصنيف:jQuery Events]]</div></td></tr>
</table>جميل-بيلونيhttps://wiki.hsoub.com/index.php?title=jQuery/one&diff=10243&oldid=prevجميل-بيلوني: إضافة محتويات الصفحة.2018-06-08T21:34:13Z<p>إضافة محتويات الصفحة.</p>
<p><b>صفحة جديدة</b></p><div><noinclude>{{DISPLAYTITLE:التابع <code>.one()</code> في jQuery}}</noinclude><br />
= <code>.one( events [, data ], handler )</code> =<br />
<br />
=== القيم المعادة ===<br />
يعيد كائنًا من النوع [[jQuery/jQuery|jQuery]].<br />
<br />
=== الوصف ===<br />
يربط هذا التابع دالة معالج حدث لحدثٍ واحدٍ أو أكثر بالعناصر المحدَّدة. يُنفَّذ معالج الحدث مرةً واحدةً لكل عنصر ولكل نوع من الأحداث المرتبطة.<br />
<br />
=== <code>.one( events [, data ], handler )</code> ===<br />
أُضيف مع الإصدار: 1.1.<br />
<br />
==== <code>events</code> ====<br />
سلسلة نصية تحتوي على نوع حدث واحد أو عدَّة أنواع من أحداث [[JavaScript]] مثل "click" أو "submit,".<br />
<br />
==== <code>data</code> ====<br />
[[JavaScript/Object|كائن مجرَّد]] (Object) يحتوي على البيانات التي ستُمرَّر إلى مُعالِج الحدث في <code>event.data</code> عندما يُستدعَى الحدث.<br />
<br />
==== <code>handler</code> ====<br />
دالة من الشكل <code>[[JavaScript/Function|Function]]( Event eventObject )</code> وتمثِّل الدالة المراد تنفيذها عندما يُستدعَى الحدث.<br />
<br />
=== <code>.one( events [, selector ] [, data ], handler )</code> ===<br />
أضيف مع الإصدار: 1.7.<br />
<br />
==== <code>events</code> ====<br />
[[JavaScript/String|سلسلة نصية]] تحتوي على نوع حدث واحد، أو عدَّة أنواع أحداث مفصولة بمسافة فارغة بالإضافة إلى مجال الاسم (اختياريَّا) مثل "click"، أو "keydown.myPlugin".<br />
<br />
==== <code>selector</code> ====<br />
سلسلة نصية تمثِّل اسم المحدِّد الذي يرشِّح أحفاد (descedants) العناصر المحدَّدة حاليًا التي تستدعي الحدث. إن كانت قيمة هذا الوسيط null أو لم يُعطَ، فسيُتسدعى الحدث دومًا عند الوصول إلى العنصر المحدَّد.<br />
<br />
==== <code>data</code> ====<br />
أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى إمكانيَّة استخدام أي نوع)، ويُمثِّل البيانات التي ستُمرَّر إلى مُعالِج الأحداث في <code>event.data</code> عندما يُستدعَى الحدث.<br />
<br />
==== <code>handler</code> ====<br />
دالة من الشكل <code>[[JavaScript/Function|Function]]( Event eventObject )</code> وتمثِّل الدالة المراد تنفيذها عندما يُستدعى الحدث. يُمكن استعمال القيمة <code>false</code> كاختصارٍ لدالةٍ وظيفتها هي إعادة هذه القيمة (<code>return false</code>).<br />
<br />
=== <code>.one( events [, selector ] [, data ] )</code> ===<br />
أضيف مع الإصدار: 1.7.<br />
<br />
==== <code>events</code> ====<br />
[[JavaScript/Object|كائن مجرَّد]] (Object) تمثِّل المفاتيح فيه نوعَ حدثٍ واحدٍ أو عدَّة أنواع أحداث مفصولة بمسافة فارغة بالإضافة إلى مجال الاسم (اختياريًّا)، وتمثِّل القيم فيه دالة معالج الحدث المراد تنفيذها عندما يُستدعَى الحدث.<br />
<br />
==== <code>selector</code> ====<br />
سلسلة نصية تمثِّل اسم المحدِّد الذي يرشِّح أحفاد (descedants) العناصر المحدَّدة حاليًا التي تستدعي الحدث. إن كانت قيمة هذا الوسيط <code>[[JavaScript/null|null]]</code> أو لم يُعطَ، فسيُتسدعى الحدث دومًا عند الوصول إلى العنصر المحدَّد.<br />
<br />
==== <code>data</code> ====<br />
أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى إمكانيَّة استخدام أي نوع)، ويُمثِّل البيانات التي ستُمرَّر إلى مُعالِج الأحداث في <code>event.data</code> عندما يُستدعَى الحدث.<br />
<br />
التابع <code>.one()</code> مماثل تمامًا للتابع <code>[[jQuery/on|.on()]]</code> باستثناء أنَّ معالج الحدث للعنصر المعطى يُفك ارتباطه بنوع الحدث بعد استدعائه في المرة الأولى. انظر إلى الشيفرة التالية مثلًا:<syntaxhighlight lang="javascript"><br />
$( "#foo" ).one( "click", function() {<br />
alert( "ستظهر هذه الرسالة مرة واحدة فقط." );<br />
});<br />
</syntaxhighlight>بعد تنفيذ الشيفرة، سيؤدي الضغط لأول مرة على العنصر ذي المعرِّف "foo" إلى اظهار رسالة تنبيه. الضغط على العنصر في المرات اللاحقة ليس له أي تأثير. هذه الشيفرة تقابل الشيفرة التالية:<syntaxhighlight lang="javascript"><br />
$( "#foo" ).on( "click", function( event ) {<br />
alert( "ستظهر هذه الرسالة مرة واحدة فقط." );<br />
$( this ).off( event );<br />
});<br />
</syntaxhighlight>بعبارةٍ أخرى، الاستدعاء الصريح للتابع <code>[[jQuery/off|.off()]]</code> من ضمن معالج الحدث المرتبط له نفس التأثير تمامًا في التابع <code>[[jQuery/off|.off()]]</code>.<br />
<br />
إن احتوى الوسيط الأول على أكثر من نوع حدث واحد وكانت مفصولة فيما بينها بفراغ، فسيُستدعى معالج الحدث مرةًَ واحدةًَ لكل نوع من أنواع الأحداث تلك.<syntaxhighlight lang="javascript"><br />
$( "#foo" ).one( "click mouseover", function( event ) {<br />
alert( "الحدث " + event.type + " قد وقع فعلًا." );<br />
});<br />
<br />
</syntaxhighlight>في المثال السابق، ستظهر رسالة التنبيه مرتين لأنَّه مُرِّر إلى التابع حدثين (الحدث <code>click</code> والحدث <code>mouseover</code>).<br />
<br />
== أمثلة ==<br />
تغيير شكل كل عنصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code> عند الضغط عليه لمرة واحدة:<syntaxhighlight lang="html"><br />
<!doctype html><br />
<html lang="ar"><br />
<head><br />
<meta charset="utf-8"><br />
<title>one مثالٌ عن استعمال التابع</title><br />
<style><br />
div {<br />
width: 60px;<br />
height: 60px;<br />
margin: 5px;<br />
float: left;<br />
background: green;<br />
border: 10px outset;<br />
cursor:pointer;<br />
}<br />
p {<br />
color: red;<br />
margin: 0;<br />
clear: left;<br />
}<br />
</style><br />
<script src="https://code.jquery.com/jquery-1.10.2.js"></script><br />
</head><br />
<body><br />
<br />
<div></div><br />
<div></div><br />
<div></div><br />
<div></div><br />
<div></div><br />
<p>اضغط على المربع الأخضر</p><br />
<br />
<script><br />
var n = 0;<br />
$( "div" ).one( "click", function() {<br />
var index = $( "div" ).index( this );<br />
$( this ).css({<br />
borderStyle: "inset",<br />
cursor: "auto"<br />
});<br />
$( "p" ).text( "ضُغط على العنصر div ذي الفهرس #" + index + "." +<br />
" أصبح العدد " + (++n) + " ضغطات بالمجمل." );<br />
});<br />
</script><br />
<br />
</body><br />
</html><br />
<br />
</syntaxhighlight>إظهار محتوى فقرةٍ في مربع تنبيه لمرة واحدة عندما يُضغط عليها:<syntaxhighlight lang="html"><br />
<!doctype html><br />
<html lang="ar"><br />
<head><br />
<meta charset="utf-8"><br />
<title>one مثالٌ عن استعمال التابع</title><br />
<script src="https://code.jquery.com/jquery-1.10.2.js"></script><br />
</head><br />
<body><br />
<br />
<div class="count">0</div><br />
<div class="target">اضغط عليّ أو حرك المؤشر فوقي</div><br />
<br />
<script><br />
var n = 0;<br />
$(".target").one("click mouseenter", function() {<br />
$(".count").html(++n);<br />
});<br />
</script><br />
<br />
</body><br />
</html><br />
<br />
</syntaxhighlight><br />
<br />
== مصادر ==<br />
* [http://api.jquery.com/one/ صفحة التابع .one() في توثيق jQuery الرسمي.]<br />
[[تصنيف:jQuery]]<br />
[[تصنيف:jQuery Events]]</div>جميل-بيلوني