我正在制作一個(gè)表單，其中我使用一個(gè)類來禁用我的使用指針的輸入-甚至:none，當(dāng)我試圖單擊正確的輸入時(shí)，我的輸入是不可編輯的，但當(dāng)我使用“tab”鍵時(shí)，它聚焦于輸入，我可以編輯輸入，我如何防止焦點(diǎn)不應(yīng)該在我的輸入上使用TAB鍵，應(yīng)該允許編輯輸入。

<form style="padding:10px; margin:10px" action="" class=" form-inline">
          <div class="form-group">
            <div class="input-group">
            <div class="form-group">
                <div class="input-group">
                  <input type="text" class="form-control disabledClass" placeholder="1">
                </div>
              </div>
              <div class="form-group">
                <div class="input-group">
                  <input type="text" class="form-control disabledClass" placeholder="2" >
                </div>
              </div>

            </div>
          </div>
        </form>

CSS:
.disabledClass{
  background: #f1f1f1;
  pointer-events: none;
}

感謝您的早日回復(fù)..

指針事件CSS規(guī)則只影響指針事件(想想鼠標(biāo)事件，即使還有其他指針事件)。 通過鍵盤導(dǎo)航不是指針事件的一部分。

有一些CSS規(guī)則應(yīng)該對你的情況有所幫助，但似乎沒有一個(gè)能正常工作，而且它們也不是標(biāo)準(zhǔn)化的。

例如，我本以為非標(biāo)準(zhǔn)的moz用戶焦點(diǎn)(僅在FF中)會(huì)做到這一點(diǎn)，但事實(shí)并非如此。用戶選擇或非標(biāo)準(zhǔn)用戶修改也不會(huì)阻止它。 我發(fā)現(xiàn)的唯一方法實(shí)際上是通過HTML，通過設(shè)置readonly和tabindex="-1 "屬性(禁用也可以，但通常帶有一些暗淡的樣式):

input {
  pointer-events: none;
}
.no-focus {
  -moz-user-focus: none;
  -webkit-user-focus: none;
  -ms-user-focus: none;
  user-focus: none;
  -moz-user-modify: read-only;
  -webkit-user-modify: read-only;
  -ms-user-modify: read-only;
  user-modify: read-only;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

<input type="text" class="no-focus" value="CSS">
<input type="text" readonly value="readonly" tabindex="-1">

<pre>First click this iframe then try to navigate using TAB</pre>

您可以在表單中添加事件keydown

if (event.keyCode == 9) {
    event.preventDefault();
    return false;
}