我的假设是,如果我禁用了一个div,所有的内容也都禁用了。
然而,内容是灰色的,但我仍然可以与它互动。
有办法做到吗?(禁用一个div,让所有的内容也禁用)
我的假设是,如果我禁用了一个div,所有的内容也都禁用了。
然而,内容是灰色的,但我仍然可以与它互动。
有办法做到吗?(禁用一个div,让所有的内容也禁用)
当前回答
如何禁用<div/>的内容
CSS指针事件属性本身并不会禁止子元素滚动,并且对于<div/>元素,IE10及以下版本不支持它(仅针对SVG)。 http://caniuse.com/#feat=pointer-events
在所有浏览器上禁用<div/>的内容。
Jquery:
$("#myDiv")
.addClass("disable")
.click(function () {
return false;
});
CSS:
.disable {
opacity: 0.4;
}
/* Disable scrolling on child elements */
.disable div,
.disable textarea {
overflow: hidden;
}
在除IE10及以下版本的所有浏览器上禁用<div/>的内容。
Jquery:
$("#myDiv").addClass("disable");
CSS:
.disable {
/* Note: pointer-events not supported by IE10 and under */
pointer-events: none;
opacity: 0.4;
}
/* Disable scrolling on child elements */
.disable div,
.disable textarea {
overflow: hidden;
}
其他回答
上面的许多答案只适用于表单元素。禁用任何DIV(包括其内容)的简单方法是禁用鼠标交互。例如:
$("#mydiv").addClass("disabledbutton");
CSS
.disabledbutton {
pointer-events: none;
opacity: 0.4;
}
补充:
许多人这样评论:“这只会禁止鼠标事件,但控件仍然是启用的”和“你仍然可以通过键盘导航”。你可以将此代码添加到你的脚本中,输入不能以键盘选项卡等其他方式到达。您可以更改此代码以满足您的需要。
$([Parent Container]).find('input').each(function () {
$(this).attr('disabled', 'disabled');
});
您可以使用这个简单的CSS语句禁用事件
#my-div {
pointer-events:none;
}
我想我得插几句话。
< div >可以在IE8/9中被禁用。我认为这是“不正确的”,这让我感到困惑 不要使用. removeprop(),因为它对元素有永久的影响。使用.prop("disabled", false)代替 $ (" # myDiv”).filter(“输入、文本区域、选择按钮”)。Prop ("disabled", true)更显式,它将捕获一些您在:input中遗漏的表单元素
如果你想禁用指针事件,它很容易处理
document.getElementById("appliedDatepicker").style.pointerEvents = "none";
or
如果你想启用,
document.getElementById("appliedDatepicker").style.pointerEvents = "auto";
简单集解
看看我的选择器
$myForm.find('#fieldsetUserInfo input:disabled').prop("disabled", false);
fieldsetUserInfo是div包含我想禁用或启用的所有输入
希望这对你有所帮助