0

チェックボックスにコンテンツを表示するためのイベントを設定したい。

check="Twitter" の場合 -> twitter の内容を表示 check="Facebook" の場合 -> facebook の内容を表示

全て（twitter + facebook）にチェックを入れた場合 → twitter + facebook の内容を表示

twitter または facebook を選択する必要があります。

チェックボックスのイベントを処理しましたが、チェックボックスごとにコンテンツを表示しません: http://jsfiddle.net/vinhnguyenle/hHnUV/

        var $twitter =  $('input[name=twitter]'),
            $facebook = $('input[name=facebook]');

    $twitter.click(function(e) {
        if (!!$facebook.prop('checked') == false) {
            e.preventDefault();
        }
    });

    $facebook.click(function(e) {
        if (!!$twitter.prop('checked') == false) {
            e.preventDefault();
        }
    });

    $twitter.trigger('click');

チェックボックスがオンになっている各チェックボックスのコンテンツを表示するのを手伝ってください。

ありがとう、

4

4 に答える 4

0

これは機能します。Facebook/Twitter コンテンツを表示するためにいくつかの div を追加しました。

$(document).ready(function() {    
    $('div[id]').each(function(){
        if ($('input[name="' + this.id + '"]').is(':checked')){
            $(this).show();
         }
        else {
            $(this).hide();
        }

    });

    var $twitter =  $('input[name=twitter]'),
        $facebook = $('input[name=facebook]')

    $twitter.click(function(e) {
        $('#twitter').fadeToggle();
    });

    $facebook.click(function(e) {
        $('#facebook').fadeToggle();
    });

});

ここに.jsフィドルがあります

于 2013-03-04T15:35:24.423 に答える
0

私はお勧めします：

$('div[id]').each(function(){
    if ($('input[name="' + this.id + '"]').is(':checked')){
        $(this).show();
    }
    else {
        $(this).hide();
    }
});

$('input').change(function (e) {
    $('#' + this.name)[this.checked == true ? 'show' : 'hide']();
});

JS フィドルのデモ。

于 2013-03-04T15:26:09.963 に答える
0

1 つのイベント ハンドラーを使用して、これらの入力の変更を監視できます...

動作を示すために追加されたコンテンツ ...

コードはこちら :)

于 2013-03-04T15:38:37.293 に答える
0

Facebookが選択されている場合はTwitterを選択できないという要件に基づいて、「Twitter、Facebook、両方」のオプションを備えたラジオボタンがより理にかなっていると思います。

JS の変更:

$(document).ready(function() {   
    $("input:radio").click(function() {
        var test = $(this).val();

        $('#Facebook, #Twitter').hide();        
        $("#"+test).fadeIn();

        if(test == "Both")
        {
            $('#Facebook, #Twitter').fadeIn();
        }
    });     
});

HTML の変更:

<input type="radio" name="social" value="Twitter" checked /> Twitter
<input type="radio" name="social" value="Facebook" /> Facebook
<input type="radio" name="social" value="Both" /> Both
<div id="Facebook" style="display:none;">Facebook Content</div>
<div id="Twitter">Twitter Content</div>

JSフィドルはこちら

于 2013-03-04T16:23:57.170 に答える