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

I cleaned up your code:

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();

I agree with Cymen, you should use his method and go from there. But for the sake of answering your question, here you go.

Here it is in jsfiddle: http://jsfiddle.net/7kSb9/12/

于 2012-12-05T18:53:12.883 に答える
0 
if ($(':radio').is(':checked'))

その行は常にtrueになります。ラジオボタンがチェックされている場合にのみ、子ラジオボタンをチェックしていません。

これを試して：

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 に答える