וובמאסטר - תיכנות ובניית אתרים

מדריך DHTML - אובייקט Select

RiU/‏ 20 אפריל, 2003
F+
F-
עוד המשך קצר לנושא הטפסים, קלט בעזרת SELECT, אני אתן כמה דוגמאות בנושא ואסביר אחרי

alert(document.forms.myForm.mySelect.options[document.forms.myForm.mySelect.selectedIndex].text) 
יחזיר את ערך הטקסט שמסומן בתיבה, דרך יותר קצרה לכתוב את זה היא בצורה הבאה:

var x=document.forms.myForm.mySelect
alert(x.options[x.selectedIndex].text) 
בסקריפט הקצר למעלה אנחנו בודקים מחפשים בכל הטפסים בדף את הטופס שנקרא "myForm" בו אנחנו בוחרים את האלמנט שנקרא "mySelect" שבמקרה הוא גם Select, באלמנט אנחנו בודקים את האופציה ה-(פה נבדוק את הערך המספרי של האופציה שבחרנו), ואז בודקים מה הטקסט שלה, קצת מסובך? לא נורא, כאשר שתצטרכו להשתמש בזה תבינו את זה בשניה (-:

עוד אפשרות שניתן להשתמש בה היא ()remove, הפעם נשתמש בדרך הקצרה יותר מההתחלה:

var x=document.forms.myForm.mySelect
x.remove(x.selectedIndex) 
ב- add השימוש נעשה בצורה הבאה:

add(option,insertBefore) 
document.forms.myForm.mySelect.add("מילה שלישית",2) 
זה יכניס את "מילה שלישית לפני המקום השלישי(הספירה מתחילה מ-0) ומה שיקרה זה שהערך שהיה שלישי יהיה רביעי במקום השלישי יופיע "מילה שלישית".

הערה: יש גם טבלה נוספת ל options, אני אתן הסבר קצר לפניה.

disabledקובע או מחזיר האם האלמנט פסול או לא
form מחזיר את אלמנט הטופס לאלמנט ה- SELECT
length מחזיר את מספר האופציות באלמנט
multipleקובע או מחזיר האם אפשר לבחור יותר מאפשרות אחת בו זמנית
name משנה או מחזיר את שם האלמנט
options מחזיר קולקציה של כל האופציות באלמנט
selectedIndex מחזיר את הערך הסידורי(במספר) של הערך שנבחר
sizeמשנה או מחזיר את הגודל(מספר האופציות שרואים בו זמנית)
tabIndexמשנה או מחזיר את המספר הסידורי שבו יבחר האלמנט בעזרת טאב(TAB)
type מחזיר את סוג אלמנט ה SELECT
valueמחזיר את הערך שנקבע לאופציה המסומנת באלמנט

(add(option, insertBeforeמוסיף אופציה חדשה לקולקציית האופציות
(remove(index מסיר אופציה מקולקציית האופציות
()blur האלמנט מאבד מיקוד
()focus המיקוד עובר לאלמנט



השימוש בקולקציית options תעשה (כמו שהדגמתי בהתחלה) בצורה הבאה:

document.forms.myForm.mySelect.options[indexNumber]. 
אחרי הנקודה האחרונה תבוא אחת מהאפשרויות הבאות:

defaultSelected קובע שהאופציה תהיה ברירת המחדל
disabled קובע או מחזיר ערך בולאני האם האופציה פסולה או לא
formמחזיר את אלמנט הטופס שבו נמצא האלמנט הזה(OPTION)
index מחזיר את המספר הסידורי של האופציה
label משנה או מחזיר את התוית של האופציה
selected קובע שהאופציה הזאת תבחר
textמחזיר את הטקסט של האופציה הזאת
value משנה או מחזיר את הערך של האופציה
תגיות: JS‏  /  Javascript‏  /  DHTML‏  /  DOM‏  /  Dynamic‏  /  דינמי‏  /  Select‏  

תגובות בפייסבוק

תגובות למאמר



עוד במדריך

תגיות פופולאריות

X
הצטרף לעמוד שלנו בפייסבוק להישאר מעודכן!
וובמאסטר © כל הזכויות שמורות