// Set the tabindex atribute to -1.
1)$("divid").attr('tabindex','-1');
// Remove the tabindex atribute if exists.
2) $("divid").removeAttr('tabindex');
// This is third way.
3) $("divid").blur();
/* Prevents all mouse interactions */
.disabled-div {
opacity: 0.5;
pointer-events: none;
}
/* Prevents all other focus events */
.disabled-div:focus,
.disabled-div:focus-within {
visibility: hidden;
}
<h1>CSS Only Disable with Prevent Focus</h1>
<input placeholder="Normal text field">
<br><br>
<input class="disabled-div" placeholder="Disabled text field">
<br><br>
<input placeholder="Normal text field">
<br><br>
<input class="disabled-div" placeholder="Disabled text field">
<br><br>
6条答案
按热度按时间2g32fytz1#
<div>
应该无法接收焦点,除非您添加了tabIndex。如果添加了
tabIndex
,则应通过以下方式删除它:0qx6xfy62#
另外,如果你想让一个可聚焦的元素(表单输入元素等)成为不可聚焦的。您可以设置:
rn0zuynd3#
我不确定你是否可以让一个元素“不可聚焦”,但你肯定可以使用它的
blur
方法在特定的时间点取消它的聚焦:编辑:
我认为你可以通过在每次聚焦的时候散焦来使一个元素变得“不可聚焦”。您可以通过以下方式实现:
...或(在HTML中使用内联Javascript):
史蒂夫
vsnjm48y4#
下面是使用jquery使DIV不可聚焦的一些方法。
q8l4jmvw5#
我过去的一个项目中的纯CSS解决方案
接收焦点时略微 Flink 。这是因为当它接收焦点时,可见性被设置为“隐藏”,焦点丢失,可见性再次被设置为“可见”。这实际上是好的,因为用户现在有一些想法,重点是在那里,而去了禁用的领域…
ozxc1zmp6#
一个简单的解决方法是添加CSS:
或者通过jQuery添加相同的css:
$(div_selector).css('pointer-events', 'none');