קטגוריות: אובייקט נדחה
promise( [type,] [target] )
מחזירה: הבטחה
תיאור: מחזיר אובייקט Promise עבור צפיה, כאשר כל הפעולות מסוג מסוים קשורות לאיסוף, בתור או לא, סיימו.
.promise( [type,] [target] )
הוספה בגרסה: 1.6
type
סוג של תור.
target
אובייקט שעליו השיטות הבטחה מחוברות.
שיטה .promise() מחזירה אובייקט Promise הנוצר דינמית, שיהיה פתור, מייד שכל הפעולות מסוג מסוים הקשור לאיסוף, בתור או לא, הסתיימו.
בברירת מחדל, type שווה ל- "fx", שאומר שאובייקט Promise המוחזר לא יהיה פתור, כאשר כל האנימציה של אלמנטים נבחרים השלימו.
קונטכסט הפתור וארגומנט היחיד הם אוסף, שעליו הופעל .promise().
אם target סופק, .promise() יחבר כל השיטות עליו, ואחרי זה יחזיר אובייקט הזה, ולא יצור חדש. זה יכול להיות שימושי כדי לחבר התנהגות אל אובייקט, שכבר נוצר.
הערה: Promise המוחזר מקושר לאובייקט נדחה, המאוחסן ב-
.data()עבור אלמנט. מכיוון ששיטה.remove()מוחקת נתוני אלמנט כמו גם אלמנט עצמו, הוא ימנע מלפתור כל אובייקטים Promise של אלמנטים. יש למחוק אלמנט מ-DOM לפני שאובייקט Promise פתור, תשתמשו ב-.detach()במקום זה ותשתמשו ב-.removeData()אחרי פתרון.
דוגמאות
דוגמה 1
שימוש ב-.promise() על אוסף ללא אנימציה פעילה מחזיר אובייקט Promise פתור:
var div = $( "<div />" );
div.promise().done(function( arg1 ) {
// will fire right away and alert "true"
alert( this === div && arg1 === div );
});
דוגמה 2
פותר Promise שמוחזר כאשר כל האנימציות הסתיימו (כולל אלה שהתחילו בפונקציה של קריאה חוזרת או הוספו מאוחר יותר):<!DOCTYPE html>
<html>
<head>
<style>
div {
height: 50px; width: 50px;
float: left; margin-right: 10px;
display: none; background-color: #090;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<button>Go</button>
<p>Ready...</p>
<div></div>
<div></div>
<div></div>
<div></div>
<script>
$("button").bind( "click", function() {
$("p").append( "Started...");
$("div").each(function( i ) {
$( this ).fadeIn().fadeOut( 1000 * (i+1) );
});
$( "div" ).promise().done(function() {
$( "p" ).append( " Finished! " );
});
});
</script>
</body>
</html>דוגמה 3
פותר Promise שמוחזר באמצעות$.when() (שיטה .promise() מאפשרת לעשות זאת עם אוסף jQuery):
<!DOCTYPE html>
<html>
<head>
<style>
div {
height: 50px; width: 50px;
float: left; margin-right: 10px;
display: none; background-color: #090;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<button>Go</button>
<p>Ready...</p>
<div></div>
<div></div>
<div></div>
<div></div>
<script>
var effect = function() {
return $("div").fadeIn(800).delay(1200).fadeOut();
};
$("button").bind( "click", function() {
$("p").append( " Started... ");
$.when( effect() ).done(function() {
$("p").append(" Finished! ");
});
});
</script>
</body>
</html>האם מידע זה היה מועיל?
