2

非表示の div でコンテンツを表示および非表示にするこれらの関数があります。開閉するボタンを 1 つだけ使用するようにするにはどうすればよいですか?

<script type="text/javascript" src="js/jquery.js"></script>
    <script> 
    jQuery(document).ready(function() { 
        $('.pagesplit').click(function() { 
            $('.page-split-wrap').css({'display': 'block'}) 
            $('.page-split-wrap').animate({height: '250px'}, 500);
        });  

        $('.pagemerge').click(function() { 
            $('.page-split-wrap').animate({height: '0px'}, 500, function() { 
                $('.page-split-wrap').css({'display': 'none'}); 
            }); 
        }); 
    }); 
    </script>
4

2 に答える 2

2

.toggleの代わりにイベントを使用し.clickます。

jQuery(document).ready(function() { 
    $('.pagetoggle').toggle(function() { 
        $('.page-split-wrap').css({'display': 'block'}) 
        $('.page-split-wrap').animate({height: '250px'}, 500);
    }, function() { 
        $('.page-split-wrap').animate({height: '0px'}, 500, function() { 
            $('.page-split-wrap').css({'display': 'none'}); 
        }); 
    }); 
});
于 2013-01-17T16:00:53.547 に答える
1

deprecated を使用したくない場合は、次の.toggle()ように、クリック ハンドラーで使用する機能を切り替えることができます。

jQuery(document).ready(function() {
    var showContent = function() { 
        $('.page-split-wrap').css({'display': 'block'}) 
        $('.page-split-wrap').animate({height: '250px'}, 500);
        // Switch handlers
        $('.pagesplit').unbind('click');
        $('.pagesplit').click(hideContent);
    };  

    var hideContent = function() { 
        $('.page-split-wrap').animate({height: '0px'}, 500, function() { 
            $('.page-split-wrap').css({'display': 'none'}); 
        }); 
        // Switch handlers
        $('.pagesplit').unbind('click');
        $('.pagesplit').click(showContent);
    };  

    $('.pagesplit').click(showContent);
});
于 2013-01-17T16:12:07.503 に答える