Jquery函数单击事件未在IE8中触发

Question

有人知道为什么在本例中，单击事件不是只在IE8中触发吗？基本上，单击后的css样式(.zui-act)应该会更改label的background-color。

JSFIDDLE

<div style="width:300px;">
   <input type="radio" name="a" id="a" value="alpha" />
   <label for="a">Alpha</label>
   <input type="radio" name="a" id="b" value="bravo" />
   <label for="b">Bravo</label>
   <input type="radio" name="a" id="c" value="charly" />
   <label for="c">Charly</label>
</div>​

$.radio = function(e) {
    var a = $('input:radio').filter(function(index) { return $(this).attr('name')==e });
    a.hide();
    a.siblings('label').addClass('zui-btn');
    a.click(function(){
        var f = $(this).attr('id');
        $('label').removeClass('zui-act').filter(function(index) {
            return $(this).attr('for')==f
        }).addClass('zui-act');
    });
}

$(document).ready(function(e) {
    $.radio('a'); 
});

Answer 1

我唯一的猜测是IE8不会在隐藏元素上触发事件。我想这是有道理的。您可以采用jQuery UI buttonset的方法，并将单选按钮移出屏幕。Like so

.zui-radio {
    position:absolute;
    left:-9999px;
}

然后，在a.hide()的位置将其添加到$.radio方法中

a.addClass('zui-radio');