-2

複数のdivのトグルボタンを作成しようとしています。以下のコードを共有する、1つの優れたチュートリアルを見つけました。

<script type="text/javascript">
$(document).ready(function(){   
$('.example2').hide().before('<a href="#" id="toggle-example2" class="button">Open/Close</a>');
    $('a#toggle-example2').click(function() {
        $('.example2').slideToggle(1000);
        return false;
    });
});
</script>

.example2、.example3、...などの複数のdivクラスのコードを変更するにはどうすればよいですか。

チュートリアルは次のとおりです：http：//rpardz.com/blog/show-hide-content-jquery-tutorial/

4

1 に答える 1

1

divクラスをすでに知っている場合は、次のコードを別の関数に次のように記述できます。

    function applytoggle(divclass) {
    var linkId = 'toggle-'+divclass; 
    $('.'+divclass).hide();
    $('.'+divclass).before('<a href="#" id="'+linkId+'" class="button">Open/Close</a>');
    $('a#toggle-' + divclass).live('click', function () {
        $('.'+divclass).slideToggle(1000);
        return false;
    });
}

次に、すべてのdivのレジスタトグルイベントを次のように呼び出すことができます。

applytoggle（'example1'）; applytoggle（'example2'）;

編集：フィドルhttp://jsfiddle.net/QLGwr/6/

于 2013-03-04T13:25:59.150 に答える