internet-explorer-8 - 在 IE8 中未触发 Jquery 函数单击事件

Question

有谁知道为什么，在这个例子中，点击事件不只在 IE8 中被触发？基本上，单击 ( ) 后的css 样式.zui-act应该更改background-color.label

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

click将事件更改为change，它应该可以工作。您很可能在兼容模式下运行，其中存在错误。

当您可以让选择器处理名称时，为什么还要使用过滤器？

var myName = "a";
var myRadios = $('input[name="' + myName +'"]');

Answer 2

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

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

然后将其添加到您的$.radio方法中代替a.hide()：

a.addClass('zui-radio');