নির্দিষ্ট ইনপুটগুলিতে আইই 10 এর "পরিষ্কার ক্ষেত্র" এক্স বোতামটি সরান?

Question

এটি অবশ্যই একটি দরকারী বৈশিষ্ট্য, তবে এটি অক্ষম করার কোনও উপায় আছে কি?
উদাহরণস্বরূপ, ফর্মটি যদি একটি একক পাঠ্যক্ষেত্র হয় এবং এর পাশেই ইতিমধ্যে একটি "স্পষ্ট" বোতাম রয়েছে, তবে এক্স থাকাও অতিরিক্ত প্রয়োজন। এই পরিস্থিতিতে এটি সরিয়ে ফেলা ভাল।

এটি করা যেতে পারে, এবং যদি তাই হয়, কিভাবে?

Comments

এটি একটি ডিফল্ট মান সহ এমন ক্ষেত্রেও কার্যকর যেখানে খালি কোনও অর্থ হয় না, যেমন পরিমাণ।

— জো ফ্লিন

যেহেতু এটি কোনও ইনপুট টাইপিং ট্রিগার করে না, আপনি জাভাস্ক্রিপ্ট ইভেন্টটি বাঁধেন তখন এটি খুব জটিল।

— কিউই

Answer 1

বাক্সের জন্য ::-ms-clearসিউডো-উপাদানটি স্টাইল করুন :

.someinput::-ms-clear {
    display: none;
}

Comments

মজার বিষয় যদি আপনি IE10 এর আগে ইঞ্জিনের সাথে আপনার পৃষ্ঠাটি রেন্ডার করতে আইই সামঞ্জস্যতা মোড ব্যবহার করেন তবে এই ছদ্ম উপাদানটি কার্যকর হয় না এবং এটি বোতামটি যাইহোক দেখায়।

— ইউসুফ সলিমপুর

@ ইউউসফ: হ্যাঁ, এটি কীভাবে কাজ করে এবং একটি আসল ওয়েবসাইটে আপনার কখনই সামঞ্জস্যতা মোড ব্যবহার করবেন না তার একটি অংশ। এটি আসলে সামঞ্জস্যপূর্ণ নয় :)

— রাই-

@ এমনিটেক - উইন্ডোজ 7 মেশিনে এর

— আইই

এই নিয়ন্ত্রণটি কেবলমাত্র Win10 এ IE10 + এ প্রদর্শিত হবে। কৌশলটি হ'ল ডকুমেন্টটি একটি সামঞ্জস্যতা মোডে রাখলে এটি এখনও উপস্থিত হয়।

— এরিকল

@ এরিকল: ওয়েল, কেবল উইন 8-এ নয়। আমি এখনই উইন্ডোজ 7 ব্যবহার করছি এবং আমি আমার আই 10 তে এই এক্স বোতামটি দেখতে পাচ্ছি। সুতরাং আপনি বলতে পারেন এটি একটি আইই 10 + কেবল বৈশিষ্ট্য (যদিও আই 99 সম্পর্কে নিশ্চিত নয়) তবে কেবল উইন 8 নয়, কারণ এটি আইই 10 এর উইন 7 সংস্করণে প্রদর্শিত হয়। যাইহোক, টিপটির জন্য ধন্যবাদ, @ মিনিটেক!

— ওএমএ

Answer 2

আমি দেখেছি এটি সেট ভালো widthএবং heightকরতে 0px। অন্যথায়, আই 10 ক্ষেত্রের মধ্যে সংজ্ঞায়িত প্যাডিং উপেক্ষা করে - padding-right- যা ইনপুট ক্ষেত্রে ওভারলেলেড 'এক্স' আইকনটিতে পাঠ্যটি টাইপ করা থেকে রক্ষা করার উদ্দেশ্যে ছিল। আমি অনুমান করছি যে আইই 10 অভ্যন্তরীণভাবে সিউডো উপাদানটিতে padding-rightইনপুটটি প্রয়োগ করছে ::--ms-clear, এবং ছদ্ম উপাদানটি গোপন করে padding-rightমানটি পুনরুদ্ধার করে না input।

এটি আমার পক্ষে আরও ভাল কাজ করেছে:

.someinput::-ms-clear {
  width : 0;
  height: 0;
}

Comments

এখানে এই জাসফিডেলটি এই কাজের চিত্রটি তুলে ধরেছে: jsfiddle.net/zoldello/S5YRj

— ফিল

Answer 3

আমি টাইপ পাঠ্যের সমস্ত ইনপুট ক্ষেত্রে এই বিধিটি প্রয়োগ করব, সুতরাং এটির পরে নকল করার দরকার নেই:

input[type=text]::-ms-clear { display: none; }

কেবলমাত্র ব্যবহার করে কেউ স্বল্প নির্দিষ্ট হতে পারে:

::-ms-clear { display: none; }

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

Comments

ধন্যবাদ, এটি আমার পক্ষে কাজ করেছে।

— সুরজ জোস

Answer 4

আপনার ::-ms-clear( http://msdn.microsoft.com/en-us/library/windows/apps/hh465740.aspx ) এর জন্য স্টাইল করা উচিত :

::-ms-clear {
   display: none;
}

এবং আপনি ::-ms-revealপাসওয়ার্ড ক্ষেত্রের জন্য সিউডো-এলিমেন্টের জন্য স্টাইল করেন :

::-ms-reveal {
   display: none;
}

Comments

দ্রষ্টব্য - আপনি ::-ms-revealউপাদানটি অপসারণের আগে এটির কাজ করতে পারবেন কিনা তা নিয়ে ভাবুন ! (বা যদি আপনি এই বোতামটি সবার কাছে যেমন আসল প্রশ্নকারীকে সরবরাহ করেন তবে)) কেউ কেউ সত্যিই এটি ব্যবহার করেন।

— রাই-

@ মিনিটেক - দুর্দান্ত লাগছে। আপনি কী আমাদের ইনপুট ইভেন্টগুলিতে জাভাস্ক্রিপ্ট বাঁধাই দিয়ে কাজ করতে পারেন তা আমাদের বলতে পারেন? এটি কোনও ইভেন্ট উত্থাপন করে না তাই এটির সাথে কাজ করা প্রায় অসম্ভব।

— ড্যারেলনর্টন

Answer 5

আমি মনে করি এটি লক্ষ করার মতো যে কোনও পৃষ্ঠা যখন সামঞ্জস্যতা মোডে চলছে তখন সমস্ত শৈলী এবং সিএসএস ভিত্তিক সমাধানগুলি কাজ করে না। সামঞ্জস্যতা মোড রেন্ডারার :: - এমএস-ক্লিয়ার এলিমেন্টটিকে উপেক্ষা করে, যদিও ব্রাউজারটি এক্স দেখায়।

যদি আপনার পৃষ্ঠাটি সামঞ্জস্যতা মোডে চালানোর প্রয়োজন হয়, আপনি এক্স শো দিয়ে আটকে যেতে পারেন।

আমার ক্ষেত্রে, আমি কয়েকটি তৃতীয় পক্ষের ডেটা সীমিত নিয়ন্ত্রণের সাথে কাজ করছি, এবং আমাদের সমাধানটি ছিল "অন্বেষণ" ইভেন্টটি পরিচালনা করা এবং যদি এক্স বোতামটি দিয়ে ক্ষেত্রটি সাফ করা হয় তবে ব্যাকিং স্টোর সাফ করুন।

Answer 6

তীরগুলি আড়াল করতে এবং "সময়" ইনপুটটিতে ক্রস করতে:

#inputId::-webkit-outer-spin-button,
#inputId::-webkit-inner-spin-button,
#inputId::-webkit-clear-button{
    -webkit-appearance: none;
    margin: 0;
}