0

我尝试使用 jquery/html/css 设置我的复选框和单选输入的样式，但它不起作用。

收音机不工作。

我可以进行哪些更改以使其正常工作？

非常感谢 ！

[我知道我可以通过'+标签'使用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 '); });
    }
});

};

演示 -> http://jsbin.com/uyateb/2/edit

4

1 回答 1

0

始终检查浏览器的 JavaScript 控制台。这是你的朋友。

在您的示例中，我看到一个错误告诉我

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

这是由这个表达式引起的

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

如果名称值不同于简单名称（在您的情况下是option[218]），那么您必须在值周围使用额外的引号。因此，将您的代码更改为

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

并且错误消失了。

于 2013-07-27T19:36:04.920 回答