<!DOCTYPE html>
<html>
<body>
<form action="form_action.asp" method="get">
<span style='background-color: red;'>
<input style="FILTER: progid:DXImageTransform.Microsoft.Alpha( style=0,opacity=50);" type="checkbox" name="vehicle" value="Bike" /></span>I have a bike<br />
<span style='background-color: red;'>
<input style="-moz-opacity:0.5" type="checkbox" name="vehicle" value="Car" /></span> I have a car <br />
<input type="submit" value="Submit" />
</form>
<p>Click on the submit button, and the input will be sent to a page on the server called "form_action.asp".</p>
</body>
</html>
我在网上找到了一些示例并将其拼凑在一起，顶部输入复选框应该适用于 ie，底部应该适用于 FF 和 chrome。两者都不好用。IE看起来很草率，FF和chrome似乎根本不起作用。我正在尝试为复选框列表找出这一点，其中一些复选框根据以前的选择被禁用。我让它适用于大多数浏览器，但有些浏览器不会使框变灰。
所以，我需要弄清楚如何使用javascript使框变灰。这似乎不起作用，document.getelementbyid(elementID).style.background = "#dbdbdb";只是勾勒出盒子的轮廓。
任何帮助都非常感谢
您的清单不需要可点击？
在某些浏览器中禁用它作为简单解决方案，然后增加其他浏览器的不透明度：
document.getElementById(elementID).disabled="disabled";
document.getElementById(elementID).style.opacity="0.5";
那是假设你的背景是黑色的... 应该不会。
否则获取复选框的 x，y 位置：
function getOffset( el ) {
var _x = 0;
var _y = 0;
while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
_x += el.offsetLeft - el.scrollLeft;
_y += el.offsetTop - el.scrollTop;
el = el.offsetParent;
}
return { top: _y, left: _x };
}
var x = getOffset( document.getElementById('yourElId') ).left;
然后创建一个不透明度的黑色div，其 z 索引更高，绝对位置在复选框前面。
如果它们被禁用，那么你应该使用内置在复选框中的"disabled"属性。这既会禁用它们，又会使它们具有禁用的外观。