יצירת כפתורים באמצעות תגי קלט HTML בטפסים

click fraud protection

צור לחצני טקסט הניתנים להתאמה אישית ב HTML משתמש ב קֶלֶט תָג. ה קֶלֶט אלמנט משמש בתוך a טופס אֵלֵמֶנט.

על ידי הגדרת ה- תְכוּנָהסוּג ל "כפתור", כפתור לחיצה פשוט מייצר. אתה יכול להגדיר את הטקסט שיופיע על הכפתור, כגון "הגש", באמצעות ערך תְכוּנָה. לדוגמה:


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

כפתור ה'לחצן 'חלופי

אם כי באמצעות קֶלֶט תג כדי ליצור כפתור עובד למטרתו, זו אפשרות טובה יותר להשתמש ב- לַחְצָן תג ליצירת כפתורי HTML של האתר שלך. ה לַחְצָן התג גמיש יותר מכיוון שהוא מאפשר לך להשתמש בתמונות עבור הכפתור (מה שעוזר לך לשמור על עקביות חזותית אם שלך לאתר יש נושא עיצובי), למשל, וניתן להגדיר אותו ככפתור שלח או איפוס ללא צורך בתוספת JavaScript.

ציין את הכפתור סוּג תכונה בכל לַחְצָן תגים. ישנם שלושה סוגים שונים:

  • לַחְצָן: לכפתור אין התנהגות אינהרנטית אלא משתמשים בו יחד עם סקריפטים הפועלים בצד הלקוח שניתן לחברם לכפתור ולהוציא אותם לפועל בעת לחיצה עליו.
  • אִתחוּל: מאפס את כל הערכים.
  • שלח: הכפתור מגיש לשרת נתוני טופס (זה ערך ברירת המחדל אם לא מוגדר סוג).
instagram viewer

מאפיינים אחרים כוללים:

  • שֵׁם: נותן לכפתור שם התייחסות.
  • ערך: מציין ערך שיוקצה תחילה ללחצן.
  • השבת: מכבה את הכפתור.

ממשיכים הלאה עם כפתורים

HTML5 מוסיף תכונות נוספות ל- לַחְצָן תג שמרחיב את הפונקציונליות שלו.

  • פוקוס אוטומטי: כאשר העמוד נטען, אפשרות זו מציינת כי כפתור זה הוא המוקד. ניתן להשתמש בפוקוס אוטומטי אחד בלבד בעמוד.
  • טופס: משייך את הכפתור לטופס מסוים בתוך אותו מסמך HTML, תוך שימוש במזהה של הטופס כערך.
  • גיבוש: משמש רק עם type = "submit" וכתובת אתר כערך, היא מציינת לאן יישלחו נתוני הטופס. לעתים קרובות, היעד הוא סקריפט PHP או משהו דומה,
  • סוג פורמט: משמש רק עם type = "submit" תְכוּנָה. מגדיר את אופן קידוד נתוני הטופס כאשר הם מוגשים לשרת. שלושת הערכים הם יישום / x-www-form-urlencoded (בְּרִירַת מֶחדָל), נתונים מרובים / טופס, ו טקסט / רגיל.
  • שיטת צורה: משמש רק עם type = "submit" תְכוּנָה. זה מציין באיזו שיטת HTTP להשתמש בעת הגשת נתוני טופס לקבל אוֹ הודעה.
  • formnovalidate: משמש רק עם type = "submit" תְכוּנָה. נתוני הטופס לא יאושרו לאחר הגשתם.
  • formtarget: משמש רק עם type = "submit" תְכוּנָה. זה מציין היכן יש להציג את תגובת האתר בעת הגשת נתוני הטופס, כגון בחלון חדש וכו '. אפשרויות הערך הן_ריק, _עצמך, _הורה, _טופ, או שם מסגרת ספציפי.

קרא עוד אודות יצירת כפתורים בצורות HTML, ו כיצד להפוך את האתר שלך לידידותי יותר למשתמש.

instagram story viewer