ইনপুট প্রকার = "পাঠ্য" বনাম ইনপুট টাইপ = HTML5 এ "অনুসন্ধান"


132

এইচটিএমএল 5 এর নতুন ফর্ম ইনপুট ক্ষেত্রগুলির সাথে কাজ শুরু করার সাথে সাথে আমি এইচটিএমএল 5 তে নতুন। আমি যখন ফর্ম ইনপুট ক্ষেত্রগুলি, বিশেষত <input type="text" />এবং <input type="search" />আইএমও নিয়ে কাজ করছি তখন সাফারি, ক্রোম, ফায়ারফক্স এবং অপেরা সহ সমস্ত বড় ব্রাউজারে কোনও পার্থক্য ছিল না। এবং অনুসন্ধান ক্ষেত্রটিও নিয়মিত পাঠ্যক্ষেত্রের মতো আচরণ করে।

সুতরাং, এইচটিএমএল 5 এর মধ্যে input type="text"এবং পার্থক্যটি কী input type="search"?

এর আসল উদ্দেশ্য কী <input type="search" />?


উত্তর:


176

এই মুহূর্তে, তাদের মধ্যে একটি বিশাল চুক্তি নেই - সম্ভবত কখনও হবে না। তবে মূল বিষয়টি ব্রাউজার-নির্মাতাদের তারা চাইলে এটি দিয়ে বিশেষ কিছু করার ক্ষমতা দেওয়া।

ভাবুন <input type="number">সেলফোনেই করে, সংখ্যা প্যাড আনার, অথবা type="email"@ এবং .com যুক্ত করুন এবং বিশ্রাম উপলব্ধ কীবোর্ড এর একটি বিশেষ সংস্করণ আনার।

একটি সেলফোনে, অনুসন্ধান তারা চাইলে একটি অভ্যন্তরীণ অনুসন্ধান অ্যাপলেট আনতে পারে।

অন্যদিকে, এটি CSS এর সাথে বর্তমান ডিভসকে সহায়তা করে।

input[type=search]:after { content : url("magnifying-glass.gif"); }

12
দুটি বৈধ পয়েন্টের জন্য +1, 1) internal search applet for mobile phone। 2) ability to make better presentation। তবে, আমি উত্তরটি গ্রহণ করার জন্য অপেক্ষা করতে চেয়েছিলাম, কারণ আমি নিশ্চিত করতে চাই যে অন্য কোনও উদ্দেশ্য নেই :)
বিজিন পলরাজ

এখনই, নেই। ইনপুটগুলি এই মুহুর্তে কেবলমাত্র নাম (যেমন ইনপুট [টাইপ = রঙ] এর জন্য কেবল আংশিক সমর্থন রয়েছে), বা ব্রাউজারগুলি তাদের নিজস্ব বিশেষ হ্যান্ডলিং (টাইপ = সংখ্যা বা টাইপ = ইমেল বা টাইপ = রেঞ্জ) প্রয়োগ করেছে। অন্য কোনও বিকল্প নেই - এটি হয় ব্রাউজার দ্বারা একটি বিশেষ হ্যান্ডলিং পেয়েছে, বা তা হয় না। এই মুহুর্তে, বেশিরভাগ ব্রাউজারগুলিতে, = অনুসন্ধানটি টাইপ করে না এবং সম্ভবত তা (এটি আইটিউনস বা অন্য কোনও অ্যাপ্লিকেশনে কোনও অনুসন্ধান বাক্সের মতো দেখায় মায়াবী ব্যতীত) করবে না। বর্তমানে এটি রয়েছে যাতে আপনি এটি অনুসন্ধান বাক্সটি জেনে অতিরিক্ত কার্যকারিতা / উপস্থাপনা যুক্ত করতে পারেন।
নর্গার্ড

39
একটি পার্থক্য হ'ল অনুসন্ধানের ইনপুটটিতে [এসএসসি] চাপলে ফলাফল সাফ হবে। আপনার ব্যবহারকারীরা ঘন ঘন এটি ব্যবহার করে তবে সুপার হ্যান্ডি।
জোশ হাবদাস

@ জোশ এইচটি যে খুব কার্যকর । বর্তমানে কোন ব্রাউজারগুলি (এবং সংস্করণগুলি) প্রভাবিত করে সে সম্পর্কে কোনও ধারণা? দেড় বছর আগে ল্যান্ডস্কেপটি এখন একেবারেই আলাদা হয়ে গেছে বলে আমি উত্তরটি আপডেট করতে এবং চিরসবুজদের বর্তমান (/ ভবিষ্যত) অবস্থানে আনতে পুরোপুরি আগ্রহী।
নরগার্ড

2
আমি প্রতিস্থাপিত উপাদানগুলিতে সিউডো-উপাদানগুলি ব্যবহার করার পরামর্শ দেব না: এটি মানগুলির বিরুদ্ধে , যদিও এটি কিছু ক্ষেত্রে কাজ করে।
পল কোজলোভিচ

29

এটি বেশিরভাগ ব্রাউজারে একেবারে কিছুই করে না। এটি কেবল একটি পাঠ্য ইনপুটটির মতো আচরণ করে। এটি কোনও সমস্যা নয়। বিশেষায়নের জন্য এটি বিশেষ কিছু করার প্রয়োজন হয় না। ওয়েবকিট ব্রাউজারগুলি প্রাথমিকভাবে স্টাইলিংয়ের সাথে এটি কিছুটা আলাদাভাবে আচরণ করে।

ডিফল্টরূপে ওয়েবকিটের একটি অনুসন্ধান ইনপুটটিতে একটি ইনসেট বর্ডার, বৃত্তাকার কোণ এবং কঠোর টাইপোগ্রাফিক নিয়ন্ত্রণ থাকে।

এছাড়াও,

এটি আমি জানি না বা এটি অনুমানের মধ্যে কোথাও নথিভুক্ত করা হয়নি তবে আপনি যদি ইনপুটটিতে ফলাফলের প্যারামিটার যুক্ত করেন তবে ওয়েবকিট একটি ড্রপডাউন তীরের সাথে পূর্ববর্তী ফলাফলগুলি দেখিয়ে একটি সামান্য ম্যাগনিফাইং গ্লাস প্রয়োগ করবে।

<input type=search results=5 name=s>

উল্লেখ

সর্বোপরি, এটি এর একটি অর্থপূর্ণ অর্থ প্রদান করে input type

হালনাগাদ:

ক্রম 51 ফলাফল বৈশিষ্ট্যের জন্য সমর্থন সরিয়ে নিয়েছে:


24

দৃশ্যত / কার্যকরীভাবে, ইনপুট প্রকারটি ' অনুসন্ধান ' করা থাকলে 2 টি পার্থক্য : -

  1. আপনি একটি এক্স পাবেনবাক্সে পাঠ্য সাফ করার জন্য আপনি ইনপুট / অনুসন্ধান বাক্সের শেষে ' চিহ্ন
  2. কীবোর্ডে ' ইস্ক ' কী টিপলে পাঠ্য সাফ হয়ে যায়

এটি অবশ্যই সর্বত্র ঘটে না। কোন পরিবেশে এটি পালন করা হয়?
স্টাফেন গ্যারিচন

7

কিছু ব্রাউজারে এটি "ফলাফল" এবং "অটোসোভ" বৈশিষ্ট্যগুলিকে সমর্থন করে যা ম্যাগনিফায়ার আইকন সহ স্বয়ংক্রিয় "সাম্প্রতিক অনুসন্ধানগুলি" কার্যকারিতা সরবরাহ করে।

অধিক তথ্য


1
ক্রোম 51 resultsবৈশিষ্ট্যটির জন্য সমর্থন সরিয়ে নিয়েছে : developers.google.com/web/updates/2016/08/…
ফ্লেম

2

আসলে এটা কিছু না বলে ধরে নিয়ে খুব সাবধানতা অবলম্বন করুন। আপনি যখন টাইপ অনুসন্ধানের সাথে স্টাইল ইনপুটগুলিতে যান তাদের কিছু নির্দিষ্ট বৈশিষ্ট্য রয়েছে যা পরিবর্তন করা যায় না। একটিকে সীমান্ত পরিবর্তন করার চেষ্টা করুন এবং আপনি এটি বেশ অসম্ভব দেখতে পাবেন। অন্যান্য অননুমোদিত সিএসএস বৈশিষ্ট্যাবলী খুঁজে বার করো আছে, এই সব বিস্তারিত জানার জন্য।

যশবন্ত দ্বারা উল্লিখিত হিসাবে ফলাফলের বৈশিষ্ট্য রয়েছে, যদিও আপনি অটোস্যাভ বৈশিষ্ট্যটি অন্তর্ভুক্ত না করলে এটি খুব ভাল কাজ করে না। ড্রপ ডাউন বেশিরভাগ ব্রাউজারে কাজ করবে না, তবে আপনার নিজের বিপদে ব্যবহার করুন।


1

কর্মের মধ্যে ব্রাউজারের পার্থক্য রয়েছে, আপনি যখন কিছু শব্দ টাইপ করেন তখন type="search"ক্রোম / সাফারিতে ইনপুটটিতে কীড ইএসসি ইনপুট বাক্সটি সাফ হয়ে যায়। তবে type="text"দৃশ্যে শব্দগুলি পরিষ্কার হবে না। সুতরাং আপনি যখন স্বতঃপূরণ বা অনুসন্ধান সম্পর্কিত বৈশিষ্ট্যের জন্য এটি ব্যবহার করেন তখন বিশেষত প্রকারটি বেছে নেওয়ার বিষয়ে সতর্কতা অবলম্বন করুন


1

বোনাস পয়েন্ট: input type="search" onsearchবৈশিষ্ট্যটি ব্যবহার করার ক্ষমতা রয়েছে (যদিও আমি লক্ষ্য করেছি যে এটি মাইক্রোসফ্টস নতুন এজ ব্রাউজারে কাজ করে না), যা একটি কাস্টম onkeypress=if(key=13) { function() }জিনিস লেখার প্রয়োজনীয়তা দূর করে elim


1

ইনপুট টাইপ = "অনুসন্ধান" ব্যবহার করে কীবোর্ড প্রবেশকারীর পাঠ্য শো "অনুসন্ধান" করুন, যা ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে পারে। তবে, এই ধরণেরটি ব্যবহার করা হলে আপনাকে শৈলীর সমন্বয় করতে হবে।


0

এটি প্রোগ্রামারদের দৃষ্টিভঙ্গির উপর নির্ভর করে, কোনও প্রোগ্রামার সহজেই প্রকারটি দেখে ইনপুটটির উদ্দেশ্য নির্ধারণ করতে পারে এবং সিএসএস স্টাইলিংয়ের জন্য এবং জাভাস্ক্রিপ্ট বা জ্যাকুয়েরির জন্য ইনপুটগুলিতে নিয়ম যাচাই করা সহজ।


-1

আপনি সেট করে থাকলে তবে এটি আপনার ইনপুট উপাদানগুলিতে খারাপ প্রভাব ফেলবে

<input type="search">

এবং আপনার সিএসএসে আপনি সেট করেছেন

input {background: url("images/search_bg.gif");}

এটি মোটেও প্রদর্শন করবে না।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.