jquery 多个展开隐藏循环

旧城等待， 2022-08-13 16:35 138阅读 0赞

<!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript" src="jquery.1.6.3.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    	var hide_infos = $("div.main>div.arc").hide();
        var tit_gets = $("div.bar>span.tit_get").bind("click",
        function() {
            var _self = $(this);
            if (_self.hasClass("get_up")) {
                _self.removeClass("get_up");
    			$(this).html("展开");
                hide_infos.eq(tit_gets.index(_self)).hide()
            } else {
    			$(this).html("收起");
                _self.addClass("get_up");
                hide_infos.eq(tit_gets.index(_self)).show()
            }
        });
    });
    </script>
    </head>
    
    <style type="text/css">
    body{ margin:0; padding:0; font:12px"宋体";}
    input,button,select,textarea{outline:none;resize:none;}
    .main{ width:980px; margin:0 auto; background:#f1f1f1; padding:20px;}
    .arc p{ padding:0; margin:0; text-indent:2em; line-height:22px; }
    .bar{ text-align:right;}
    .tit_get{ cursor:pointer; background:url(qh.gif) no-repeat right; padding-right:15px;}
    .get_up{ cursor:pointer; background:url(qh1.gif) no-repeat right; padding-right:15px;}
    </style>
    <body>
    <div class="main">
    	<div class="arc">
        <p>据港媒报道，今届中期选举被视为2016年大选前哨战，民主党连场败仗，为前第一夫人希拉里的白宫梦敲响警号。昨日的初步选举结果显示，三分之二获得希拉里或其丈夫克林顿背书的候选人落败，其中3场女对男的参议院战场，被视为测试希拉里两年后角逐总统宝座的风向标，但该3名获希拉里力撑的女候选人中就有两人败北，最新民调则显示，倘选民投票时较重视党派，她与共和党潜在对手比较时处于劣势。</p>
    
    <p>希拉里在这场中期选举积极巡回全国为民主党人助选，备战2016大选的意味浓厚。截至本港时间昨日傍晚，除了1场下月进行次轮投票及11场未分胜负的选举外，获她或克林顿撑场者16人胜、30人负。</p>
    </div>
    	<div class="bar"><span class="tit_get">展开</span></div>
    
    	<div class="arc">
        <p>据港媒报道，今届中期选举被视为2016年大选前哨战，民主党连场败仗，为前第一夫人希拉里的白宫梦敲响警号。昨日的初步选举结果显示，三分之二获得希拉里或其丈夫克林顿背书的候选人落败，其中3场女对男的参议院战场，被视为测试希拉里两年后角逐总统宝座的风向标，但该3名获希拉里力撑的女候选人中就有两人败北，最新民调则显示，倘选民投票时较重视党派，她与共和党潜在对手比较时处于劣势。</p>
    
    <p>希拉里在这场中期选举积极巡回全国为民主党人助选，备战2016大选的意味浓厚。截至本港时间昨日傍晚，除了1场下月进行次轮投票及11场未分胜负的选举外，获她或克林顿撑场者16人胜、30人负。</p>
    </div>
    	<div class="bar"><span  class="tit_get">展开</span></div>
    </div>
    </body>
    </html>

用到的图片： ![Center][] ![Center 1][]

[Center]: https://img-blog.csdn.net/20141106163253460?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvYm95aXQw/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 1]: /images/20220810/9b084a33e9814830956128256ccbacc1.png