Question

我在表单上有两个文本框。一个是可编辑的已启用文本框另一个是禁用的文本框，不可编辑。我已禁用它使用CSS风格。我面临的问题是我能够访问禁用的文本框使用键盘的Tab键，如果我点击启用的文本框和按Tab键移动到禁用的文本框，我可以进入中的文字。

以下是示例html代码

    <input type="textbox" placeholder="Enabled" />
<div class="notEdit-overlay"></div>
<div>
    <input type="textbox" placeholder="Disabled" />
</div>

这是css风格

    .notEdit-overlay
{
    width: 1080px;
    height: 99%;
    left: 0px;
    background: red;
    position: absolute;
    opacity: 0;
    filter: alpha(opacity=0);
}

这是jsfiddle

Answer 1

在输入中使用disabled属性。

<input type="text" disabled="disabled" placeholder="disabled" />

也;没有输入类型文本框，如果你想要大文本框，请使用<textarea>value</textarea>

Answer 2

将禁用的框分配为tabindex -1

即。 <input type="textbox" placeholder="Disabled" tabindex="-1" />

使用Tab键可访问禁用的文本框

2 个答案: