קטגוריות: תכונות jQuery > מניפולציה
.prop( propertyName )
מחזירה: מחרוזת
תיאור: מקבל את הערך של התכונה עבור אלמנט הראשון ברשימת אלמנטים בהתאמה.
שיטה .prop() מקבלת ערך של מאפיין רק עבור אלמנט ראשון ברשימה מתאימה. היא מחזירה undefined עבור ערך של מאפיין, שלא הוגדר, או לרשימה מתאימה אין אלמנטים. כדי לקבל ערכים עבור כל אלמנט בנפרד, תשתמשו בבונה לולאות של jQuery, כמו שיטה .each() או .map().
ההבדל בין תכונות ו- מאפיינים יכול להיות חשוב במצבים ספציפיים. לפני jQuery 1.6, שיטה .attr() לפעמים לקחה בחשבון את ערך מאפיינים בעת קבלת כמה תכונות, אשר עלולה לגרום להתנהגות לא עקבית. החל מ- jQuery 1.6, שיטה .prop() מספקת דרך במפורש לאחזר ערכים של מאפיין, כאשר .attr() מאחזרת תכונות.
לדוגמה, selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, ו- defaultSelected צריכים להתקבל ולהיות מוגדרים באמצעות שיטה .prop(). לפני jQuery 1.6, מאפיינים אלה ניתן היה לקבל באמצעות שיטה .attr(), אבל זה לא היה במסגרת attr. אין להם תכונות המתאימות, אלא מאפיינים בלבד.
לגבי תכונות בוליאניות, נעין באלמנט DOM המוגדר על ידי סימון HTML <input type="checkbox" checked="checked" />, ונניח הוא נמצא בתוך משתנה של JavaScript בשם elem:
elem.checked | true (ערך בולאני) ישתנה עם המצב התיבה |
|---|---|
$(elem).prop("checked") | true (ערך בולאני) ישתנה עם המצב התיבה |
elem.getAttribute("checked") | "checked" (מחרוזת) המצב ההתחלתי של תיבת הסימון; לא משנה |
$(elem).attr("checked")(1.6) | "checked" (מחרוזת) המצב ההתחלתי של תיבת הסימון; לא משנה |
$(elem).attr("checked")(1.6.1+) | "checked" (מחרוזת) ישתנה עם המצב התיבה |
$(elem).attr("checked")(pre-1.6) | true (ערך בולאני) ישתנה עם המצב התיבה |
לפי מפרט טפסים W3C, תכונה checked היא תכונה בולאנית, כלומר תכונה מתאימה היא true אם תכונה בכלל קיימת, גם אם, למשל, לתכונה אין ערך או ערך רייק. הדרך המועדפת, התואמת לכל הדפדפנים, כדי לקבוע האם תיבה סומנה, תשתמשו באחד מהבאים:
if ( elem.checked )if ( $(elem).prop("checked") )if ( $(elem).is(":checked") )
אם אתם משתמשים ב-jQuery 1.6, קוד if ( $(elem).attr("checked") ) יקבל ערך אמיתי של תכונה, אשר אינו משתנה בסימון של תיבה. הוא נועד רק לאחסן את ברירת המחדל או הערך הראשוני של תכונה checked. כדי לשמור על תאימות לאחור, שיטה .attr() ב- jQuery 1.6.1+ תקבל ותשנה תכונות בשבילכם, כך ששום קוד עבור תכונה לוגית לא צריך להשתנות על .prop(). עם זאת, הדרך המועדפת לקבל ערך checked היא אחת מאפשרויות המפורטות לעיל. כדי לראות איך זה עובד ב jQuery האחרונה, סמנו / בטלו את תיבת הסימון בדוגמה להלן.
הערות נוספות:
- ב- Internet Explorer לפני גרסה 9, שימוש ב-
.prop()כדי להגדיר מאפיין של אלמנט DOM, השונה מערך פשוט (מספר, מחרוזת, או ערך בולאני) יכול לגרום לדליפות זיכרון, אם מאפיין לא נמחק (תשתמשו ב-.removeProp()) לפני שאלמנט DOM נמחק מהמסמך. כדי להגדיר ערכי של אובייקט DOM בבטחה ללא דליפת זיכרון, תשתמשו ב-.data().
דוגמה
מציג מאפיין checked ותכונה של תיבת סימון ברגע שינוי.<!DOCTYPE html>
<html>
<head>
<style>
p { margin: 20px 0 0 }
b { color: blue; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<input id="check1" type="checkbox" checked="checked">
<label for="check1">Check me</label>
<p></p>
<script>
$("input").change(function() {
var $input = $(this);
$("p").html(".attr('checked'): <b>" + $input.attr('checked') + "</b><br>"
+ ".prop('checked'): <b>" + $input.prop('checked') + "</b><br>"
+ ".is(':checked'): <b>" + $input.is(':checked') ) + "</b>";
}).change();
</script>
</body>
</html>.prop( propertyName,value )
מחזירה: jQuery
תיאור: מגדיר אחד או יותר מאפיינים עבור רשימת אלמנטים בהתאמה.
.prop( propertyName, value )
הוספה בגרסה: 1.6
propertyName
שם המאפיין להגדרה.
value
ערך להגדיר עבור מאפיין.
.prop( map )
הוספה בגרסה: 1.6
מפה
מפת זוגות מאפיין-ערך עבור הגדרה.
.prop( propertyName, function(index, oldPropertyValue) )
הוספה בגרסה: 1.6
propertyName
שם המאפיין להגדרה.
function(index, oldPropertyValue)
פונקציה המחזירה ערך עבור הגדרה. מקבלת מיקום של אינדקס של אלמנט ברשימה, וערך ישן בתור ארגומנטים. בתוך הפונקציה מילת מפתח this מתייחסת אל אלמנט נוכחי.
שיטה .prop() היא דרך נוחה לקבוע את ערך של מאפיין, במיוחד כאשר מגדרים מאפיינים מרובים, שימוש בערכים המוחזרים על ידי הפונקציה, או הגדרת ערכים על אלמנטים מרובים בבת אחת. הוא אמור לשמש בעת הגדרת selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, או defaultSelected. החל מ- jQuery 1.6, תכונות אלה כבר לא יכולות להיות מוגדרות באמצעות שיטה .attr(). אין להם מאפיינים המתאימים, אלא תכונות בלבד.
מאפיינים בדרך כלל משפיעים על מצב דינמי של אלמנט DOM מבלי לשנות את תכונת ה-HTML. דוגמה מכילה ערך של תכונה של אלמנטים קלט, תכונה disabled של אלמנטים קלט וכפתורים, או מאפיין checked של תיבת סימון. שיטה .prop() צריכה להשתמש עבור הגדרת disabled ו- checked במקום שיטה .attr(). בשיטה .val() יש להשתמש עבור קבלת והגדרת ערך.
$("input").prop("disabled", false);
$("input").prop("checked", true);
$("input").val("someValue");
חשוב: שיטה .removeProp() לא אמורה לשמש כדי לקבוע מאפיינים אלה ל-false. ברגע שמאפיין יליד הוסר, לא ניתן להוסיף אותו שוב. ראו .removeProp() עבור מידע מפורט.
חישוב ערך של מאפיין
באמצעות פונקציה להגדרת מאפיינים, ניתן לחשב את הערך מבוססות על מאפיינים אחרים של אלמנט. לדוגמה, כדי למתג את כל תיבות מבוסס על הערכים האישיים שלהן:
$("input[type='checkbox']").prop("checked", function( i, val ) {
return !val;
});
הערה: אם שום דבר לא הוחזר לפונקצית הגדרה (כלומר function(index, prop){}), או אם undefined הוחזר, ערך נוכחי לא ישתנה. זה שימושי כדי להגדיר ערכים באופן סלקטיבי.
הערות נוספות:
- ב- Internet Explorer לפני גרסה 9, שימוש ב-
.prop()כדי להגדיר מאפיין של אלמנט DOM, השונה מערך פשוט (מספר, מחרוזת, או ערך בולאני) יכול לגרום לדליפות זיכרון, אם מאפיין לא נמחק (תשתמשו ב-.removeProp()) לפני שאלמנט DOM נמחק מהמסמך. כדי להגדיר ערכי של אובייקט DOM בבטחה ללא דליפת זיכרון, תשתמשו ב-.data().
דוגמה
מכבה את כל התיבות סימון בדף.<!DOCTYPE html>
<html>
<head>
<style>
img { padding:10px; }
div { color:red; font-size:24px; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<input type="checkbox" checked="checked" />
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" checked="checked" />
<script>
$("input[type='checkbox']").prop({
disabled: true
});
</script>
</body>
</html>האם מידע זה היה מועיל?
