TechCodeview

במאמר זה נלמד כיצד לקבל ערכים נבחרים ברשימה הנפתחת בעזרת jQuery. קודם כל, נבין את המאמר הזה באמצעות שיטת jQuery, jQuery selector ו-jQuery val () . לאחר מכן, נבין את הנושא בעזרת דוגמאות שונות.

למה אתה מתכוון ב-jQuery?

jQuery היא ספריית JavaScript מהירה, קלת משקל, קטנה ועשירה בתכונות.

בעוד לולאה java

השתמש ב-jQuery: בורר שנבחר בשילוב עם שיטת val () כדי למצוא את ערך האופציה שנבחר ברשימה נפתחת.

הבורר ב-jQuery:

זהו רכיב HTML שבו ההצהרה מיושמת.

לדוגמה: נבחר, בדק וכו'.

נבחר משמש לציון בחירת ברירת המחדל כאשר הטופס נטען לראשונה.

שיטת val () ב-jQuery:

שיטה זו משמשת כדי לקבל את הערכים של רכיבי טופס או להגדיר את ערך התכונה המשמשת עבור האלמנטים שנבחרו.

תחביר:

 $(selector).val (); 

דוגמא:

 $('input: text').val ('javaTpoint!'); 

רשימה נפתחת עם ותג.

תגי הבחירה והאפשרות משמשים ליצירת תפריטים נפתחים. הם מאפשרים למשתמש לבחור אפשרויות בודדות או מרובות מתוך רשימה של אפשרויות. כל האפשרויות אינן מוצגות על המסך, אך הן גלויות כאשר הן מושכות את הרשימה הנפתחת. הם משמשים לחיסכון במקום מכיוון שרק פריט אחד מהרשימה מוצג.

ליצירת רשימות נפתחות, נעשה שימוש בתג במקום בתג . התג המזווג מתחיל בתג הפותח ומסתיים בתג הסוגר. יש להשתמש בתג זה עם התג.

תחביר:

 Text Label-1 Text Label-2 ………………………………………………………………………………………………….. ………………………………………………………………………………………………….. 

התכונות השונות בהן נעשה שימוש בתג הן:

מרובות:הוא משמש להגדרת התג כך שיקבל אפשרויות רבות. כברירת מחדל, זה יכול לקחת אפשרות בודדת שנבחרה על ידי המשתמש. כדי לבחור אפשרויות מרובות, משתמש צריך ללחוץ על קליק תוך כדי לחיצה על האפשרות.שֵׁם:הוא משמש לציון שם עבור הרשימה הנפתחת.

התכונות השונות בהן נעשה שימוש בתג הן:

ערך:הוא משמש לציון הערך שנשלח עם הגשת הטופס. אם תכונת הערך מושמטת בתג, אזי נעשה שימוש בתוכן הכותרת.נבחר:הוא משמש לציון הבחירה שנבחרה מראש כאשר הטופס נטען לראשונה בדפדפן.

הדוגמאות הבאות משמשות כדי לקבל את הערך שנבחר מהרשימה הנפתחת ב-jQuery.

דוגמה 1:

כיצד לקבל ערך נבחר מהרשימה הנפתחת ב-jQuery.

 Get Selected Value in drop-down using jQuery h1 { color: green; } h5 { color: green; } h4 { color: green; } p { color: red; } .select { margin: 40px; width: 60%; height: 300px; padding: 30px; border: 2px solid green; } body { background-color: pink; } $(document).ready (function () { $(&apos;select.country&apos;).change (function () { var selectedCountry = $(this).children(&apos;option:selected&apos;).val(); alert (&apos;You have selected the country - &apos; + selectedCountry); }); }); <p> <b> Get Selected Value in drop-down using jQuery </b> </p> <h4> Select Country from drop-down list: </h4> <br> United States India United Kingdom Brazil Germany <br> <br> <b> Get selected values from list </b> 

הֶסבֵּר:

בדוגמה שלמעלה, יצרנו רשימה נפתחת בעזרת ותג. בכך, אם נבחר ערך מרובה מהרשימה וניצור א לאחר בחירת הרכיב המרובה מהרשימה ונלחץ על כפתור, הוא מציג הודעת התראה עם הרכיב שנבחר מהרשימה הנפתחת.

 United States India United Kingdom Brazil Germany <br> <br> <b> Get selected values from list </b> 

כאן,

מחלקה מופשטת java

גודל ='3' משמש להצגת מספר האלמנטים המוצגים ברשימה הנפתחת, מרובה משמשת לבחירת ערכים מרובים מהרשימה הנפתחת.

תְפוּקָה:

הפלט של דוגמה זו מובא להלן.