الانتقال إلى المحتوى الرئيسي

كيفية إزالة الصليب في حقل البحث الإدخال

  • الدكتورة أناهيد بنو عجل
  • المدونة

يعد حقل بحث الإدخال أحد العناصر الأكثر شيوعا في صفحة الويب. يسمح للمستخدمين بإدخال نص للبحث عن معلومات على الموقع. ومع ذلك ، غالبا ما ينتبه المستخدمون إلى تقاطع صغير يظهر على الجانب الأيمن من حقل الإدخال بعد إدخال النص. عند النقر فوق هذا التقاطع ، يتم مسح حقل الإدخال.

بالنسبة لبعض المستخدمين ، فإن الصليب هو عنصر تصميم أخرق أو ببساطة مثير للغضب. في هذه الحالة ، يمكنك إزالة الصليب من حقل الإدخال باستخدام أنماط كس. للقيام بذلك ، يكفي تعيين خاصية "صورة الخلفية" لعنصر "الإدخال" وتحديد ارتباط إلى صورة شفافة ، أو استخدام فئات خاصة وعناصر زائفة.

إذا كنت تريد إزالة التقاطع من جميع حقول الإدخال على موقعك ، فيمكنك استخدام محدد "الإدخال[النوع=البحث]". على سبيل المثال:

إدخال [نوع=بحث] {

  صورة الخلفية: لا شيء !هام;

}

وبالتالي ، يمكنك إزالة التقاطع الذي يزعجك من حقل بحث الإدخال على موقعك وإنشاء واجهة أكثر جمالية وسهلة الاستخدام للمستخدمين.

  1. كيفية إزالة الحرف " س "من سلسلة في حقل الإدخال" بحث
  2. الطريقة 1: تغيير نمط كس
  3. الطريقة 2: تغيير رمز هتمل
  4. الطريقة 3: استخدام جافا سكريبت
  5. سؤال وجواب

كيفية إزالة الحرف " س "من سلسلة في حقل الإدخال" بحث

عند تطوير مواقع الويب ، غالبا ما يكون من الضروري إضافة حقل إدخال للبحث عن معلومات على الصفحة. ومع ذلك ، افتراضيا ، " البحث "حقل الإدخال غالبا ما يعرض رمز" س " (عادة في شكل الصليب) ، والذي يسمح لك لمسح محتويات الحقل.

إذا كنت ترغب في إزالة الحرف " س "من السلسلة في حقل الإدخال "بحث" ، يمكنك استخدام الطرق التالية:

  • تصميم حقل الإدخال: باستخدام كس ، يمكنك تغيير مظهر وسلوك حقل الإدخال ، بما في ذلك الحرف" س". للقيام بذلك ، يمكنك استخدام عنصر زائف ::- بكت-بحث-إلغاء زر ، والذي يسمح لك لنمط زر لمسح حقل الإدخال من متصفح الويب كروم وسفاري. على سبيل المثال ، يمكنك إخفاء الحرف " س " باستخدام رمز كس التالي:

"`

إدخال [نوع= "بحث"]::-بكت-بحث-إلغاء زر {

عرض: لا شيء;

}

«`

  • جافا سكريبت: هناك طريقة أخرى لإزالة الحرف " س " من السلسلة في حقل إدخال البحث وهي استخدام جافا سكريبت. باستخدام جافا سكريبت ، يمكنك الوصول إلى عنصر من حقل الإدخال ، وحذف الحرف " س " وتنفيذ الإجراءات اللازمة. على سبيل المثال ، باستخدام شفرة جافا سكريبت التالية ، يمكنك إزالة الحرف" س " من السطر في حقل الإدخال:

"`

فار المدخلات = وثيقة.جيتليمنتبيد ("بحث");

المدخلات.البحث = وظيفة () {

المدخلات.القيمة = المدخلات.القيمة.يستعاض عن (/س / ز،"");

};

«`

في هذا المثال ، نحصل على عنصر حقل الإدخال باستخدام طريقة جيتليمنتبيد وتعيين وظيفة أونسيرتش ، وهو ما يسمى عند إجراء البحث. داخل الدالة ، نستبدل جميع الأحرف " س " في قيمة حقل الإدخال بسلسلة فارغة باستخدام طريقة الاستبدال.

وهكذا ، باستخدام كس أو جافا سكريبت ، يمكنك إزالة الحرف "س" من السلسلة في حقل إدخال البحث لتحقيق النتيجة المرئية أو الوظيفية المطلوبة على موقع الويب الخاص بك.

الطريقة 1: تغيير نمط كس

طريقة واحدة لإزالة الصليب في حقل البحث الإدخال هو تغيير نمط كس. اتبع الخطوات التالية:

  1. فتح ملف نمط المشروع الخاص بك (عادة ملف مع .تمديد المغلق).
  2. ابحث عن محدد حقل بحث الإدخال. في معظم الحالات ، سيبدو الإدخال [النوع= "بحث"].
  3. أضف الخاصية التالية إلى هذا المحدد: المظهر: لا شيء؛. ستعمل هذه الخاصية على تعطيل الأنماط القياسية لحقل بحث الإدخال.
  4. احفظ ملف النمط وقم بتحديث الصفحة باستخدام حقل بحث الإدخال. يجب الآن إخفاء الصليب.

نموذج رمز المغلق:

الإدخال [النوع="بحث"] {

المظهر: لا شيء;

}

يرجى ملاحظة أن هذه الطريقة قد لا تعمل في بعض المتصفحات أو إصدارات المتصفح ، لذلك يوصى بالتحقق من النتيجة في متصفحات مختلفة بعد تطبيق تغييرات النمط.

الطريقة 2: تغيير رمز هتمل

هناك طريقة أخرى لإزالة التقاطع في حقل بحث الإدخال وهي تغيير رمز هتمل للعنصر نفسه.

  1. في رمز هتمل لها.
  2. .

هنا مثال:

بعد التغييرات ، سيبدو رمز هتمل الخاص بك كما يلي:

بعد حفظ التغييرات وتحديث الصفحة ، يجب أن يختفي التقاطع من حقل بحث الإدخال.

قد يؤثر على وظيفة عنصر "بحث الإدخال" وتفاعله مع المكونات الأخرى للصفحة. يجدر أيضا التفكير في التوافق مع المتصفحات والأجهزة المختلفة.

الطريقة 3: استخدام جافا سكريبت

إذا كنت ترغب في إزالة الصليب في حقل البحث المدخلات باستخدام جافا سكريبت ، يمكنك استخدام التعليمات البرمجية التالية:

    });