0

我正在尝试编写这个假蒙面单选按钮,当用户单击或点击 a li 时,它会找到并检查子复选框并将我拥有的图标的 css 从 opacity-0 更改为 opacity-1,基本上显示图标,一切正常,当单击 li 时,这会触发每个 li 上的复选框,但是当用户选择任何其他选项时,图标应该回到 opacity-0,一直试图找到解决方案,但没有运气。希望有人可以提供帮助。我有一个http://jsfiddle.net/creativestudio/7kSb9/1/

这是我想要工作的 JS:

        function selectingLocation(){
            $('.location-list li').bind("click tap",function() {

                $(this).find(':radio').attr('checked','checked');

        //        $(':radio').on("change",function(){

                    if ($(':radio').is(':checked')) {
                        $(this).find('label').children().css({"color":"red"});
                    }
                    else {
                        $(this).find('label').children().css({"color":"white"});
                    }                                                            
          //     });

            });
        } selectingLocation();
4

2 回答 2

0
if ($(':radio').is(':checked'))

那条线将永远是正确的。您没有检查子单选按钮,只要检查了任何单选按钮。

尝试这个:

function selectingLocation(){
    $('.location-list li').bind("click tap",function() {

        $(this).find(':radio').attr('checked','checked');
        $(".location-list li").find("label").children().css({"opacity":"0"});
        $(this).find("label").children().css({"opacity":"1"});

    });
} selectingLocation();

小提琴:http: //jsfiddle.net/JDewzy/7kSb9/8/

于 2012-12-05T18:50:46.227 回答
0

我清理了你的代码:

function selectingLocation(){
$('.location-list li').bind("click tap",function() {
  $('.location-list li label').children().css({"opacity":"0"});
  $(this).find(':radio').attr('checked','checked').end().find('label').children().css({"opacity":"1"});
});
} selectingLocation();

我同意 Cymen 的观点,你应该使用他的方法并从那里开始。但是为了回答你的问题,给你。

这是在jsfiddle:http: //jsfiddle.net/7kSb9/12/

于 2012-12-05T18:53:12.883 回答