الفرق بين المراجعتين لصفحة: «jQuery/event/stopImmediatePropagation»
لا ملخص تعديل |
Khaled-yassin (نقاش | مساهمات) |
||
| سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE: | <noinclude>{{DISPLAYTITLE:الخاصية <code>event.stopImmediatePropagation()</code> في jQuery}}</noinclude> | ||
== <code>event.stopImmediatePropagation()</code> == | == <code>event.stopImmediatePropagation()</code> == | ||
=== القيمة المعادة === | === القيمة المعادة === | ||
تُعيد هذه الخاصية القيمة <code>[[JavaScript/undefined|undefined]]</code>. | |||
=== الوصف === | === الوصف === | ||
تمنع هذه الخاصية تنفيذ بقية معالجات الأحداث ومنع الحدث من الانتقال عبر شجرة DOM إلى العناصر الأب (event bubbling). | |||
=== <code>event.stopImmediatePropagation()</code> === | === <code>event.stopImmediatePropagation()</code> === | ||
أُضيف مع الإصدار: [http://api.jquery.com/category/version/1.3 1.3]. | أُضيف مع الإصدار: [http://api.jquery.com/category/version/1.3 1.3]. | ||
لا | لا تقبل هذه الخاصية أي وسائط. | ||
بالإضافة إلى منع تنفيذ أي معالجات إضافية على عنصر ما، فإن | بالإضافة إلى منع تنفيذ أي معالجات إضافية على عنصر ما، فإن هذه الخاصية أيضًا تمنع الانتقال عبر شجرة DOM إلى العناصر الأب عن طريق استدعاء <code>[[jQuery/event/stopPropagation|event.stopPropagation()]]</code> ضمنيًا. لمنع الحدث من الانتقال إلى العناصر الأب ببساطة مع السماح الأحداث الأخرى بالتنفيذ على نفس العنصر، يمكن استخدام <code>[[jQuery/event/stopPropagation|event.stopPropagation()]]</code> بدلاً من ذلك. | ||
تستخدم الخاصية <code>event.isImmediatePropagationStopped()</code> للتحقق من استدعاء هذه الخاصية (على كائن الحدث هذا). | |||
=== ملاحظات إضافية === | === ملاحظات إضافية === | ||
| سطر 26: | سطر 26: | ||
<head> | <head> | ||
<meta charset="utf-8"> | <meta charset="utf-8"> | ||
<title>event.stopImmediatePropagation | <title>event.stopImmediatePropagation مثال على الخاصية</title> | ||
<style> | <style> | ||
p { | p { | ||
| سطر 51: | سطر 51: | ||
}); | }); | ||
$( "p" ).click(function( event ) { | $( "p" ).click(function( event ) { | ||
// | // هذه الدالة لن تنفذ | ||
$( this ).css( "background-color", "#f00" ); | $( this ).css( "background-color", "#f00" ); | ||
}); | }); | ||
$( "div" ).click(function( event ) { | $( "div" ).click(function( event ) { | ||
// | // هذه الدالة ستنفذ | ||
$( this ).css( "background-color", "#f00" ); | $( this ).css( "background-color", "#f00" ); | ||
}); | }); | ||
| سطر 65: | سطر 65: | ||
== مصادر == | == مصادر == | ||
* [http://api.jquery.com/event.stopImmediatePropagation/ صفحة | * [http://api.jquery.com/event.stopImmediatePropagation/ صفحة الخاصية event.stopImmediatePropagation في توثيق jQuery الرسمي]. | ||
[[تصنيف:jQuery]] | [[تصنيف:jQuery]] | ||
[[تصنيف:jQuery Method]] | [[تصنيف:jQuery Method]] | ||
[[تصنيف:jQuery Events]] | [[تصنيف:jQuery Events]] | ||
المراجعة الحالية بتاريخ 11:53، 6 يونيو 2018
event.stopImmediatePropagation()
القيمة المعادة
تُعيد هذه الخاصية القيمة undefined.
الوصف
تمنع هذه الخاصية تنفيذ بقية معالجات الأحداث ومنع الحدث من الانتقال عبر شجرة DOM إلى العناصر الأب (event bubbling).
event.stopImmediatePropagation()
أُضيف مع الإصدار: 1.3.
لا تقبل هذه الخاصية أي وسائط.
بالإضافة إلى منع تنفيذ أي معالجات إضافية على عنصر ما، فإن هذه الخاصية أيضًا تمنع الانتقال عبر شجرة DOM إلى العناصر الأب عن طريق استدعاء event.stopPropagation() ضمنيًا. لمنع الحدث من الانتقال إلى العناصر الأب ببساطة مع السماح الأحداث الأخرى بالتنفيذ على نفس العنصر، يمكن استخدام event.stopPropagation() بدلاً من ذلك.
تستخدم الخاصية event.isImmediatePropagationStopped() للتحقق من استدعاء هذه الخاصية (على كائن الحدث هذا).
ملاحظات إضافية
نظرًا لأن التابع .live() يعالج الأحداث بمجرد نشرها إلى أعلى المستند، لا يمكن إيقاف نشر أحداث live. وبالمثل، فإن الأحداث التي يعالجها التابع .delegate() سوف تنتشر إلى العناصر التي فُوِّضَت إليها؛ ستُنفَّذ بالفعل معالجات الأحداث المرتبطة بأي عناصر تحتها في شجرة DOM في الوقت الذي يُستدعى فيه معالج الحدث المفوَّض. لذلك، قد تمنع هذه المعالجات المعالجَ المفوَّض من التشغيل عن طريق استدعاء event.stopPropagation() أو إعادة false .
أمثلة
منع استدعاء معالجات الأحداث الأخرى:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>event.stopImmediatePropagation مثال على الخاصية</title>
<style>
p {
height: 30px;
width: 150px;
background-color: #ccf;
}
div {
height: 30px;
width: 150px;
background-color: #cfc;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>paragraph</p>
<div>division</div>
<script>
$( "p" ).click(function( event ) {
event.stopImmediatePropagation();
});
$( "p" ).click(function( event ) {
// هذه الدالة لن تنفذ
$( this ).css( "background-color", "#f00" );
});
$( "div" ).click(function( event ) {
// هذه الدالة ستنفذ
$( this ).css( "background-color", "#f00" );
});
</script>
</body>
</html>