本文翻译自：Remove IE10's “clear field” X button on certain inputs?

It's a useful feature, to be sure, but is there any way to disable it? 这是一个有用的功能，但是有没有办法禁用它？ For instance, if the form is a single text field and already has a "clear" button beside it, it's superfluous to also have the X. In this situation, it would be better to remove it. 例如，如果表单是单个文本字段并且旁边已经有一个“清除”按钮，那么也有多余的X.在这种情况下，删除它会更好。

Can it be done, and if so, how? 可以这样做，如果是，怎么做？

#1楼

参考：https://stackoom.com/question/wm1v/在某些输入上删除IE-的-清除字段-X按钮

#2楼

Style the ::-ms-clear pseudo-element for the box: 为该框设置::-ms-clear伪元素的样式：

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

#3楼

I found it's better to set the width and height to 0px . 我发现最好将width和height设置为0px 。 Otherwise, IE10 ignores the padding defined on the field -- padding-right -- which was intended to keep the text from typing over the 'X' icon that I overlayed on the input field. 否则，IE10会忽略在字段上定义的填充 - padding-right - 这是为了防止文本在我覆盖在输入字段上的“X”图标上键入。 I'm guessing that IE10 is internally applying the padding-right of the input to the ::--ms-clear pseudo element, and hiding the pseudo element does not restore the padding-right value to the input . 我猜测IE10在内部将输入的padding-right应用于::--ms-clear伪元素，并且隐藏伪元素不会将padding-right值恢复为input 。

This worked better for me: 这对我来说效果更好：

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

#4楼

I would apply this rule to all input fields of type text, so it doesn't need to be duplicated later: 我将此规则应用于text类型的所有输入字段，因此不需要在以后复制：

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

One can even get less specific by using just: 通过使用以下内容，甚至可以减少特定：

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

I have used the later even before adding this answer, but thought that most people would prefer to be more specific than that. 我甚至在添加这个答案之前就使用了后者，但是认为大多数人都希望比这更具体。 Both solutions work fine. 两种解决方案都很好。

#5楼

You should style for ::-ms-clear ( http://msdn.microsoft.com/en-us/library/windows/apps/hh465740.aspx ): 您应该为::-ms-clear样式（ http://msdn.microsoft.com/en-us/library/windows/apps/hh465740.aspx ）：

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

And you also style for ::-ms-reveal pseudo-element for password field: 你也为密码字段设置::-ms-reveal伪元素的样式：

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

#6楼

I think it's worth noting that all the style and CSS based solutions don't work when a page is running in compatibility mode. 我认为值得注意的是，当页面在兼容模式下运行时，所有基于样式和CSS的解决方案都不起作用。 The compatibility mode renderer ignores the ::-ms-clear element, even though the browser shows the x. 即使浏览器显示x，兼容模式渲染器也会忽略:: - ms-clear元素。

If your page needs to run in compatibility mode, you may be stuck with the X showing. 如果您的页面需要在兼容模式下运行，您可能会遇到X显示。

In my case, I am working with some third party data bound controls, and our solution was to handle the "onchange" event and clear the backing store if the field is cleared with the x button. 在我的情况下，我正在使用一些第三方数据绑定控件，我们的解决方案是处理“onchange”事件并清除后备存储，如果使用x按钮清除字段。