显示隐藏文本

想要一种效果，点“+”这个符号显示下面的文字内容，点“-”隐藏文本内容。像很多网站的那种问题答案一样。

解决方案 »

  1.   

    +- 显示/不显示 就是 display:none/block 的问题
    点+时，display block。点-时，display none 不就行了吗？
    你要用jquery的话，直接用 animate效果中的slideUp和slideDown就行了
      

  2.   


    $(document).ready(function(){
        $(a).click(function(e){
            if($("#sunfishlu").css("display")=="none")
            {
                $("#sunfishlu").show("slow");
                //$("#sunfishlu").css("display","block");
            }
            else
            {
                $("#sunfishlu").hide("slow");
                //$("#sunfishlu").css("display","none");
            }
        });
    });
      

  3.   

    典型的显隐问题，可以通过js实现
    document.getElementById("xx").display == "block"        //设置其显示
    document.getElementById("xx").display == "none"         //设置其隐藏
      

  4.   

    jquery:$(function(){
    $('a').click(function(){
    $('.answer').toggle();return false;
    });
    });
      

  5.   

    先把所有你要点击加号后显示的东西都正常显示出来，然后在不需要显示的内容加上dispaly:none;当点击+号时，改为dispaly:blod;
      

  6.   

    对啦 这是简单的JS问题 你也可以用jquery来写
      

  7.   

    js实现基本的显隐，jquery实现有滑动效果的显隐！根据需要任选一种
      

  8.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-31j">
    <title>Insert title here</title>
    <style type="text/css">

    table {
    border-style: solid;
    border-width: 1px;
    border-color: #008080;
    background-color: #00CC66;
    }

    .displayButton {
    border-style: solid;
    border-width: 1px;
    border-color: #000000;
    background-color: transparent;
    cursor: pointer;
    }
    </style>
    <script type="text/javascript">
    function changeDisplay(titleId, detailId, dispBtn) { var titleSpan = document.getElementById(titleId);
    var detailId = document.getElementById(detailId);

    if (dispBtn.value == "+") {
    titleSpan.style.display = "none";
    detailId.style.display = "inline";
    dispBtn.value = "-";
    } else {
    titleSpan.style.display = "inline";
    detailId.style.display = "none";
    dispBtn.value = "+";
    }
     
    }
    </script>
    </head>
    <body>
    <table width="600px">
    <tr>
    <td width="20px" style="vertical-align:top;">
    <input class="displayButton" type="button" value="+" onclick="changeDisplay('title1', 'detail1', this)">
    </td>
    <td>
    <span id="title1">Title....</span>
    <span id="detail1" style="display:none">DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    DetailDetailDetailDetailDetailDetailDetailDetailDetailDetail
    </span>
    </td>
    </tr>
    </table>
    </body>
    </html>
    做了一个简单的