在某些输入上删除IE10的"清除字段"X按钮?

Nie*_*sol 722 css internet-explorer-10

这是一个有用的功能,但是有没有办法禁用它?例如,如果表单是单个文本字段并且旁边已经有一个"清除"按钮,那么也有多余的X.在这种情况下,删除它会更好.

可以这样做,如果是,怎么做?

Ry-*_*Ry- 1226

设置框的::-ms-clear伪元素样式:

.someinput::-ms-clear {
    display: none;
}
Run Code Online (Sandbox Code Playgroud)

  • @EricLaw:嗯,不仅仅是在Win8上.我现在正在使用Windows 7,我可以在IE10中看到那些X按钮.所以你可能会说这是IE10 +唯一的功能(虽然不确定IE9),但绝对不是Win8,因为它出现在IE10的Win7版本中.无论如何,感谢小费,@ minitech! (48认同)
  • 如果您使用IE兼容模式在IE10之前使用引擎呈现您的页面,这很有趣,这个伪元素不起作用,无论如何它都会显示按钮. (14认同)
  • 此控件仅出现在Win8上的IE10 +中.诀窍在于文档处于兼容模式时仍会出现. (3认同)
  • @roshan:永远不要在兼容模式下工作. (3认同)
  • 在兼容模式下工作时,这个"X"会变得很头疼.在[microsoft官方回复](http://connect.microsoft.com/IE/feedback/details/783743)上花了很多钱. (2认同)

jim*_*imp 269

我发现它的更好的设置widthheight0px.否则,IE10会忽略在字段上定义的填充padding-right- 这是为了防止文本在我覆盖在输入字段上的'X'图标上键入.我猜测IE10在内部将padding-right输入应用于::--ms-clear伪元素,并且隐藏伪元素不会将padding-right值恢复为input.

这对我来说效果更好:

.someinput::-ms-clear {
  width : 0;
  height: 0;
}
Run Code Online (Sandbox Code Playgroud)

  • 这是一个jsFiddle,说明了这个解决方法:http://jsfiddle.net/zoldello/S5YRj/ (3认同)

Wal*_*rée 101

我将此规则应用于text类型的所有输入字段,因此不需要在以后复制:

input[type=text]::-ms-clear { display: none; }
Run Code Online (Sandbox Code Playgroud)

通过使用以下内容,甚至可以减少特定:

::-ms-clear { display: none; }
Run Code Online (Sandbox Code Playgroud)

我甚至在添加这个答案之前就使用了后者,但是认为大多数人都希望比这更具体.两种解决方案都很好.


duc*_*dhm 74

您应该为::-ms-clear(http://msdn.microsoft.com/en-us/library/windows/apps/hh465740.aspx)设置样式:

::-ms-clear {
   display: none;
}
Run Code Online (Sandbox Code Playgroud)

您还::-ms-reveal为密码字段的伪元素设置样式:

::-ms-reveal {
   display: none;
}
Run Code Online (Sandbox Code Playgroud)

  • 注意 - 想一想在删除之前是否可以使`:: - ms-reveal`元素工作!(或者,如果你为每个人提供这个按钮,就像原始的提问者一样.)有些人确实使用它. (6认同)
  • @minitech - 听起来不错.你能告诉我们如何使用Javascript绑定输入事件吗?它不会引发事件,因此几乎不可能使用它. (3认同)

Tom*_*411 10

我认为值得注意的是,当页面在兼容模式下运行时,所有基于样式和CSS的解决方案都不起作用.即使浏览器显示x,兼容模式渲染器也会忽略:: - ms-clear元素.

如果您的页面需要在兼容模式下运行,您可能会遇到X显示.

在我的情况下,我正在使用一些第三方数据绑定控件,我们的解决方案是处理"onchange"事件并清除后备存储,如果使用x按钮清除字段.