تعلم جزء HTML 29: استخدام السمات المعطلة والقابلة للاستهداف في نماذج HTML
من المؤكد أنك تعرف بالفعل علامة <input>وظيفتها في المقالة السابقة. تُستخدم هذه العلامة لإنشاء عناصر تُستخدم لطلب معلومات من المستخدم. يمكن أن تكون هذه العلامة بشكل عام في شكل مربعات نصية وأزرار ومربعات اختيار وغيرها.
ناقشنا في البرنامج التعليمي السابقحول استخدام علامات الإدخال في HTML وقيم نوع الإدخال مثل النص وكلمة المرور والإرسال. حسنًا ، في هذا البرنامج التعليمي ، سوف نناقش استخدام السمات المقروءة والمعطلة والهدف في نماذج HTML. هذه السمات الثلاث بالتأكيد لها وظائف مختلفة في تنفيذها. لمزيد من التفاصيل حول السمات الثلاث ، دعنا نلقي نظرة على البرنامج التعليمي التالي:
سمات للقراءة فقط والمعوقين
بشكل عام ، يتم قراءة السمات فقط وتعطيلهاتستخدم لجعل مربع النص غير قابل للاستخدام. لأغراض معينة ، تحتاج بالتأكيد إلى هاتين السمتين بحيث لا يمكن تغيير مربع النص ، على سبيل المثال لمربع نص له قيمة افتراضية. فيما يلي شرح لهاتين السمتين.
1. السمة للقراءة فقط
يتم استخدام السمة للقراءة فقط لتحديد أنه يمكن قراءة عنصر <input> فقط دون أن يكون قابلاً للتحرير. فيما يلي مثال على كتابة واستخدام السمة للقراءة فقط في نموذج HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Readonly pada Form HTML</title>
</head>
<body>
<form action="proses_input.php" method="get">
Kode Barang :
<input type="text" name="kode" value ="BRG01" readonly> <br><br>
Jumlah Barang :
<input type="text" name="jumlah"><br><br>
Harga per satuan :
<input type="text" name="harga"><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
بعد تنفيذ الرمز أعلاه في المتصفح ، سيظهر كما هو موضح أدناه:
في العمود كود الصنف، لا يمكنك الإرسالالمدخلات البيانات لأنه تم إعطاء العمود السمة للقراءة فقط ، لذلك يمكن قراءة العمود فقط ولا يمكن تحريره أو تغييره.
2. سمات المعوقين
يتم استخدام السمة المعطلة لتعطيلعنصر (على سبيل المثال عنصر إدخال). على غرار السمة للقراءة فقط ، لا يلزم كتابة هذه السمة ، فقط قم بتعطيل الكتابة. فيما يلي مثال على كتابة السمات المعطلة واستخدامها في نماذج HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Disabled pada Form HTML</title>
</head>
<body>
<form action="proses_input.php" method="get">
Kode Barang :
<input type="text" name="kode" value ="BRG01" disabled> <br><br>
Jumlah Barang :
<input type="text" name="jumlah"><br><br>
Harga per satuan :
<input type="text" name="harga"><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
بعد تنفيذ الرمز أعلاه في المتصفح ، سيظهر كما هو موضح أدناه:
الاختلافات في السمات المعطلة والقراءة
من النموذجين أعلاه ، يمكنك أن ترىالفرق من استخدام السمات للقراءة فقط والمعوقين. تحتفظ السمة للقراءة فقط بمربع النص كالمعتاد بينما تجعل السمة المعطلة مربع النص رماديًا. ومع ذلك ، هناك فرق تحتاج إلى معرفته أنه عند النقر فوق الزر إرسال ، لا تزال القيمة في السمة للقراءة فقط تُرسل إلى الخادم بينما لا يتم تعطيل السمة المعطلة.
3. سمات الهدف
يتم استخدام السمة الهدف لتحديد المكانمن الرد الذي تم تلقيه بعد تقديم النموذج بنجاح. قيم السمات المستهدفة هي _ blank و _self و _parent و _top. شرح استخدام السمة الهدف هذه في المقالة كيفية إنشاء ارتباطات بتنسيق HTML.
فيما يلي مثال على رمز الكتابة واستخدام السمة الهدف في نموذج HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Target di HTML Forms</title>
</head>
<body>
<form action="proses_input.php" method="get" target="_blank">
Nama Depan: <input type="text" name="ndepan"><br>
Nama Belakang: <input type="text" name="nbelakang"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
بعد تنفيذ الرمز أعلاه في المتصفح ، سيظهر كما هو موضح أدناه:
عند النقر فوق الزر "إرسال" ، سيتم عرض نتائج الاستجابة المستلمة في علامة تبويب جديدة.
هذا كل ما في المادة التي تستخدم السمات للقراءة والاستهداف وتعطيل في نموذج HTML. استمر في زيارة هذه المدونة لأنه سيتم تحديث مواد تعلم HTML للمبتدئين دائمًا.