IE10'un belirli alanlardaki “alanı temizle” X düğmesi kaldırılsın mı?

742

Emin olmak için yararlı bir özelliktir, ancak devre dışı bırakmanın herhangi bir yolu var mı?
Örneğin, form tek bir metin alanıysa ve zaten yanında bir "temizle" düğmesi varsa, X'e sahip olmak da gereksizdir. Bu durumda, onu kaldırmak daha iyi olur.

Bu yapılabilir ve eğer öyleyse, nasıl?

css internet-explorer-10

— Karanlık Mutlak
kaynak

1

Bu, boşluğun anlamsız olduğu, örneğin miktar gibi varsayılan değeri olan bir alanda da kullanışlıdır.

— Joe Flynn

4

Bu bir girdi yazmayı tetiklemediğinden, javascript olayını bağladığınızda bu çok zordur.

— Kiwy

1267

Kutu için ::-ms-clearsözde öğeye stil verin :

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

— Ry-
kaynak

14

IE10'dan önceki motorlarla sayfanızı oluşturmak için IE uyumluluk modunu kullanırsanız, bu sözde öğe çalışmaz ve düğmeyi yine de gösterir.

— Yousef Salimpour

@Yousef: Evet, bu şekilde çalışır ve gerçek bir web sitesinde Uyumluluk Modunu neden hiç kullanmamanızın bir parçası. Aslında uyumlu değil :)

— Ry-

@minitech - Windows 7 makinesindeki IE9

— ManJan

3

Bu denetim SADECE Win8'de IE10 + 'da görünür. Hile, belge bir uyumluluk moduna alındığında hala görünmesidir.

— EricLaw

48

@EricLaw: SADECE Win8'de DEĞİL. Şu anda Windows 7 kullanıyorum ve bu X düğmelerini IE10'umda görebiliyorum. Yani IE10 + sadece bir özellik (IE9 hakkında emin değilim) diyebilirsiniz, ancak bu kesinlikle IE10'un Win7 sürümünde göründüğü için sadece Win8 DEĞİL. Neyse, bahşiş için teşekkürler, @minitech!

— OMA

272

Bunun ayarlamanın daha iyi buldum widthve heighthiç 0px. Aksi takdirde, IE10, alanda tanımlanan - padding-right- metnin giriş alanına yerleştirdiğim 'X' simgesinin üzerine yazmasını engellemek üzere tasarlanmış dolguyu yok sayar . IE10 dahili padding-rightolarak ::--ms-clearsözde öğeye giriş uyguluyor ve sözde öğeyi gizleme padding-rightdeğeri değerini geri değil tahmin ediyorum input.

Bu benim için daha iyi çalıştı:

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

— jimp
kaynak

3

İşte bu geçici çözümü gösteren bir jsFiddle: jsfiddle.net/zoldello/S5YRj

— Phil

106

Ben daha sonra çoğaltılması gerekmez, bu metin türü metin giriş alanlarına uygulamak istiyorum:

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

Sadece aşağıdakileri kullanarak daha az spesifik olabilir:

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

Daha sonra bu cevabı eklemeden önce kullandım, ancak çoğu insanın bundan daha spesifik olmayı tercih edeceğini düşündüm. Her iki çözüm de iyi çalışıyor.

— Wallace Sidhrée
kaynak

Teşekkürler, benim için çalıştı.

— Sooraj Jose

76

Şunu belirtmelisiniz ::-ms-clear( http://msdn.microsoft.com/en-us/library/windows/apps/hh465740.aspx ):

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

Ayrıca ::-ms-reveal, parola alanı için sözde öğe stili de yaparsınız :

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

— ducdhm
kaynak

6

Not - ::-ms-revealkaldırmadan önce elemanın çalışıp çalışmayacağını düşünün ! (Ya da bu düğmeyi orijinal asker gibi herkes için sağlıyorsanız.) Bazıları gerçekten kullanıyor.

— Ry-

3

@minitech - kulağa harika geliyor. Giriş olaylarında Javascript bağlamasıyla nasıl çalışacağını söyleyebilir misiniz? Bir olay yaratmaz, bu nedenle çalışmak neredeyse imkansızdır.

— DarrellNorton

11

Bir sayfa uyumluluk modunda çalışırken tüm stil ve CSS tabanlı çözümlerin çalışmadığını belirtmek gerekir. Uyumluluk modu oluşturucusu, tarayıcı x'i göstermesine rağmen :: - ms-clear öğesini yok sayar.

Sayfanızın uyumluluk modunda çalışması gerekiyorsa, X göstergesiyle sıkışmış olabilirsiniz.

Benim durumumda, bazı üçüncü taraf veri bağlı kontrollerle çalışıyorum ve çözümümüz "onchange" olayını işlemek ve alan x düğmesiyle temizlenirse destek deposunu temizlemekti.

— TomXP411
kaynak

0

Okları gizlemek ve "zaman" girişini çaprazlamak için:

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

— ClemPat
kaynak