Javascript IE中的复选框问题

选中的属性不工作IE8，下面是代码：

.chkBox {
    padding: 20px 4px 10px 11px;
}

.chkBox input[type="checkbox"]{
    display: none;
}
.chkBox input[type="checkbox"]+label span{
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    background-color: white;
    border:2px solid black;
    cursor: pointer;
    margin-right:5px;
}
.chkBox input[type="checkbox"]:checked+label span{
    background-color:#000000;
    background-image: url(checkmarktick.png);
    background-repeat: no-repeat;
    background-position-x: 3px;
    background-position-y: 3px;

}

.chkBox label {
    color: #8c8c8c;
}

HTML代码

 <div class="chkBox">
    <input type="checkbox" id="hello" />
    <label for="hello"><span></span>Hello</label>
 </div>

你好

摆弄

---

我几乎尝试了所有其他插件，如slevtizr、IE7和pollyfill，但都不起作用。谁能告诉我如何解决这个问题。

IE8不支持

：checked

CSS选择器。它只是添加到IE9中

获取此选择器和其他选择器的完整浏览器支持表

您可以使用两种变通方法：

改用

[选中]

。这将选择属性为选中的元素

使用类似polyfill IE8的库来支持此CSS选择器和其他更新的CSS选择器

---

那就试试吧。