0

我使用 EXT.Js 框架，我遇到了 IE9 的问题（在 IE8 和以前的版本中都可以正常工作）：单击它时，所有复选框附近都有一个虚线边框。我试图在主css文件中设置：

body.ext-ie input{
    outline: none;
}

但它不起作用。

我认为它与我的复选框相关的标签有关，但我真的不知道如何修复它。

我的问题的一个例子：

红色的错误行为

生成此复选框的 ExtJs 代码是：

{
    fieldLabel: 'XXXX XXXX',    
    name: 'XXXX',                
    xtype: 'checkbox',    
    disabled: !isXXXXX}

此处提供了一个 css 文件：css 文件

更新 1

我已将 ExtJS 文件更正如下： JS：

items [{
    fieldLabel: 'xxx',    
    name: 'xxx',                
    xtype: 'checkbox', 
    style: {outline: 'none'}, 
    onfocus: function() {this.style.outline = "none"; }
 }]

它生成以下html：

<div class="x-form-check-wrap" id="ext-gen271" style="width: 180px;">
  <input type="checkbox" autocomplete="off" id="ext-comp-1161" name="persistentRecoveryEnabled" class=" x-form- 
 checkbox x-form-field" style="outline: none;" checked="">
  <label for="ext-comp-1161" class="x-form-cb-label" id="ext-gen272">&nbsp;</label>
</div>

在文档模式 Quirks Mode(Page default) 中，虚线出现在“x-form-cb-label”周围。

在文档模式 IE9 标准虚线中不会出现此设置。

CSS修改根本没有帮助。

所以，有两个问题：

  1. 如何为class="x-form-cb-label"via JS 设置样式？
  2. 如何通过 JS 将文档模式 IE9 标准设置为页面默认值？(html 由 ExtJS 生成)
4

3 回答 3

1

是的，正如您所怀疑的那样，这是您所在领域的一个outline领域label。

您隐藏的代码outline不起作用的原因是因为您将大纲指定为字段，而不是标签。

（尽管给出了您向我们展示的代码，但我想知道为什么它是空格而不是说XXXX XXXX？）

如果你想隐藏它，你应该使用label你的选择器而不是input：

label {
    outline: 0;
}

不过，在您这样做之前，值得指出的是，当前所选字段周围的虚线轮廓对于某些用户来说是一项重要功能。特别是，不能使用鼠标的残疾用户在使用键盘导航网站时依赖它，以便他们知道他们在页面上的位置。

如果您隐藏，您将积极歧视这些用户。（取决于您的网站受众，这对您来说可能并不特别重要，但请注意它在某些国家/地区是非法的）

于 2013-03-28T17:27:01.840 回答
0

试试这个

label:focus
{
    outline:none;
}
于 2013-03-29T17:07:15.793 回答
0

我使用了类似style='background:#fff;border:none;'的css，它可以很好地删除ie9中复选框周围的边框。

于 2015-03-10T15:34:46.450 回答