Question

我需要这个javascript的帮助，以允许以下内容开始隐藏，并在点击按钮时显示信息。请帮忙！

$(document).ready(function(){
    /* show or hide gadget */
    $('a[rel="hide_block"]').click(function(){
        if ( $(this).parent('div').parent('div').children('div.java_content').css('height')=='auto') {
            $(this).css('background-image','url(images/gadget_dropdown.jpg)');
        } else {
            $(this).css('background-image','url(images/gadget_dropup.jpg)');
        }
        $(this).parent('div').parent('div').children('div.java_content').slideToggle();
        return false;
    });

Answer 1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {            
            $('a[rel="hide_block"]').click(function (e) {
                e.preventDefault();

                var objJavaContent = $(this).parents('div.MainParent').find('div.java_content');
                $(this).addClass(objJavaContent.css('height') == 'auto' ? 'gadget_dropdown' : 'gadget_dropup');
                objJavaContent.slideToggle();
            });
        });
    </script>
    <style type="text/css">
        .gadget-dropdown
        {
            background-color: Red;
        }

        .gadget_dropup
        {
            background-color: Yellow;
        }
    </style>
</head>
<body>
    <div class="MainParent">
        <div class="java_content" style="display: none;">
            test test test test test test test test test test test test test test test test
            test test test test test test test test test test test test test test test test
            test test test test test test test test test test test test test test test test
            test test test test
        </div>
        <div>
            <a rel="hide_block">Show/Hide</a>
        </div>
    </div>
</body>
</html>

放下询问

1 个答案: