Question

我尝试使用jquery / html / css设置我的复选框和收音机输入的样式，但它无效。

广播无效。

我可以做些什么改变才能让它发挥作用？

非常感谢！

[我知道我可以通过'+ label'用css3做到这一点，但由于某些原因无法解决。我喜欢这个jquery，因为如果它是禁用的，它仍然适用于浏览器]

这是代码：

修改（http://www.filamentgroup.com/examples/customInput/customInput.jquery.js）

jQuery.fn.customInput = function(){
$(this).each(function(i){   
    if($(this).is('input:checkbox,input:radio')){
        var input = $(this);

        // get the associated label using the input's id
        var label = input.next();

        // wrap the input + label in a div 
        var wrapper = $("<div/>");
        if (input.is(':checkbox')) {
            wrapper.addClass("custom-checkbox");
        }
        else {
            wrapper.addClass("custom-radio");
        }
        wrapper.insertBefore(input).append(input, label);

        // necessary for browsers that don't support the :hover pseudo class on labels
        label.hover(
            function(){ 
                if (!this.disabled) {
                    $(this).addClass('hover');
                } 
            },
            function(){ 
                $(this).removeClass('hover'); 
            } 
        );

        //bind custom event and trigger it, then bind click,focus,blur events                   
        input.bind('updateState', function(){   
            label.toggleClass("disabled", input.is(":disabled"));
            if (input.is(':checked')) {
                if (input.is(':radio')) {
                    $('input[name='+input.attr('name')+']').each(function(){
                        $('label[for='+$(this).attr('id')+']').removeClass('checked');
                    });     
                }
                label.addClass('checked');
            }
            else { 
                label.removeClass('checked');
            }
        })
        .trigger('updateState')
        .click(function(){ 
            $(this).trigger('updateState'); 
        })
        .focus(function(){ 
            label.addClass('focus'); 
        })
        .blur(function(){ label.removeClass('focus '); });
    }
});

};

演示 - ＆gt; http://jsbin.com/uyateb/2/edit

Answer 1

请务必查看浏览器的javascript控制台。这是你的朋友。

在你的例子中，我看到一个错误告诉我

Uncaught Error: Syntax error, unrecognized expression: [name=option[218]]

由此表达式引起

$('input[name='+input.attr('name')+']')

如果名称值与简单名称不同（在您的情况下为option[218]），则必须在值周围使用额外的引号。所以将代码更改为

$('input[name="'+input.attr('name')+'"]')

并且错误消失了。

Jquery输入复选框＆amp;收音机 - 不工作

1 个答案: