循环引导面板[关闭]答案

【问题标题】：Looping bootstrap panels [closed]循环引导面板[关闭]
【发布时间】：2015-11-21 05:13:19
【问题描述】：

现有代码是这样的（井-xxxx 是自定义井，将品牌颜色应用于默认井）->

    <div class="panel-group" id="accordion1">
  <div class="panel panel-info">
    <div class="panel-heading" data-toggle="collapse" data-parent="#accordion2015" href="#year2015" title="Click to expand/collapse">
        <h4 class="panel-title">Publication Year: 2015 (4 publications until now)</h4>
    </div>
    <div id="year2015" class="panel-collapse collapse">
        <div class="panel-body">
            <div class="well well-info"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-info"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-info"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-info"><p>Title/Brief</p><p>Author</p></div>
        </div>
    </div>
  </div>
  <div class="panel panel-warning">
    <div class="panel-heading" data-toggle="collapse" data-parent="#accordion2014" href="#year2014" title="Click to expand/collapse">
        <h4 class="panel-title">Publication Year: 2014</h4>
    </div>
    <div id="year2014" class="panel-collapse collapse">
        <div class="panel-body">
            <div class="well well-warning"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-warning"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-warning"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-warning"><p>Title/Brief</p><p>Author</p></div>
        </div>
    </div>
  </div>
  <div class="panel panel-success">
    <div class="panel-heading" data-toggle="collapse" data-parent="#accordion2013" href="#year2013" title="Click to expand/collapse">
        <h4 class="panel-title">Publication Year: 2013</h4>
    </div>
    <div id="year2013" class="panel-collapse collapse">
        <div class="panel-body">
            <div class="well well-success"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-success"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-success"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-success"><p>Title/Brief</p><p>Author</p></div>
        </div>
    </div>
  </div>
</div>

会有一个数组来存储引导品牌（'info'、'warning'、'primary'、'success'）.. & 重复的内容将在循环中包含品牌类。就像一个面板是一个面板是主要的..接下来是成功..然后是信息..欢迎两种 php n jquery 解决方案。

【问题讨论】：

你有什么问题？
查看我的代码.. 有一个重复的模式.. 我想制作一个循环来打印面板
我查看了您的代码，无论是它还是您的附加评论都不足以说明您的问题，我们无法为您提供帮助。你的数据来自哪里？这些是某种手风琴布局吗？每个面板会有不同的信息吗？该信息在加载时可用还是通过 ajax 加载？我们最终可能会问很多这样的问题。我们可以提供帮助，但首先，您需要清楚地说明您正在努力实现的目标、您已经尝试过的内容以及您的尝试未能实现目标的原因。
随意投反对票.. 但请分享您对为什么这样做的意见
由于上述原因，我是反对票的一员。这不是个人的，但就目前而言，这个问题对 SO 的价值很小。不过可以更改选票。更好地解释你的问题是什么，我相信计数会逆转:)

标签： php jquery twitter-bootstrap codeigniter

【解决方案1】：

我知道你想在twitter-bootstrap 课程上loop

<div class="panel-group" id="accordion1">
<?php $brands = array('info','warning','primary','success');
$year = '2015';
//loop brands
foreach($brands as $brand): 
?>
  <div class="panel panel-<?php echo $brand; ?>">
    <div class="panel-heading" data-toggle="collapse" data-parent="#accordion<?php echo $year; ?>" href="#year<?php echo $year; ?>" title="Click to expand/collapse">
        <h4 class="panel-title">Publication Year: <?php echo $year; ?> (4 publications until now)</h4>
    </div>
    <div id="year<?php echo $year; ?>" class="panel-collapse collapse">
        <div class="panel-body">
            <div class="well well-<?php echo $brand; ?>"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-<?php echo $brand; ?>"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-<?php echo $brand; ?>"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-<?php echo $brand; ?>"><p>Title/Brief</p><p>Author</p></div>
        </div>
    </div>
  </div>
<?php 
$year--;
endforeach; ?>
</div>

【讨论】：

谢谢.. foreach 最简单
这对我很有帮助。

【解决方案2】：

这将打印从 2015 年到 $year_limit 的面板，您可以将其设置为您需要的任何内容

<?php $year = 2015;
      $year_limit = 1990;
      $i =0;
      $brand = array('info', 'warning', 'success');
while($year < $year_limit){
    if($i == 3)
       $i =0;?>
    <div class="panel panel-<?php echo $brand[$i];?>">
    <div class="panel-heading" data-toggle="collapse" data-parent="#accordion<?php echo $year;?>" href="#year<?php echo $year;?>" title="Click to expand/collapse">
        <h4 class="panel-title">Publication Year: <?php echo $year;?></h4>
    </div>
    <div id="year<?php echo $year;?>" class="panel-collapse collapse">
        <div class="panel-body">
            <div class="well well-<?php echo $brand[$i];?>"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-<?php echo $brand[$i];?>"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-<?php echo $brand[$i];?>"><p>Title/Brief</p><p>Author</p></div>
            <div class="well well-<?php echo $brand[$i];?>"><p>Title/Brief</p><p>Author</p></div>
        </div>
    </div>
<?php $year--; $i++;?>
<?php } ?>

【讨论】：

sorry karan 的解决方案更好。
你还需要井组