[asp.net]在一个循环中使用索引来设置独特属性

发布时间: 2016/11/12 1:54:26
注意事项: 本文中文内容可能为机器翻译,如要查看英文原文请点击上面连接.

使用一个循环来呈现的 Im <div> 带有选项卡的但它在每个列表中的项目:

@foreach (var item in Model.things)
{
    int counts = 1;

    <div class="col-md-12">
        <!-- BOX -->
        <div class="box border red">
            <div class="box-title">
                <h4><i class="fa fa-columns"></i><span class="hidden-inline-mobile">@item.Name</span></h4>
            </div>
            <div class="box-body">
                <div class="tabbable header-tabs">
                    <ul class="nav nav-tabs">
                        <li class=""><a href="#box_tab2"  data-toggle="tab"><i class="fa fa-circle-o"></i> <span class="hidden-inline-mobile">More</span></a></li>
                        <li class=""><a href="#box_tab1" data-toggle="tab"><i class="fa fa-laptop"></i> <span class="hidden-inline-mobile">Profile</span></a></li>

                    </ul>
                    <div class="tab-content">
                        <div class="tab-pane fade active in" id="box_tab1">
                            <p>Content #1</p>
                            <p>...</p>
                        </div>
                        <div class="tab-pane fade" id="box_tab2">
                            <p>Content #2</p>
                            <p>...</p>
                        </div>

                    </div>
                </div>
            </div>
        </div>
        <!-- /BOX -->
    </div>
}

这里的问题是中的 harcoded 值,例如︰

<a href="#box_tab2>   that "opens"  the tab id="box_tab2".

当然这并不工作时有几个选项卡与相同的 id。 我也许可以使用索引以便能够分配唯一值在需要的地方吗?

解决方法 1:

你在正确的方式使用计数器/索引,您必须使用它来构建你的 Id,在你 nav-tabs :

<li><a href='@String.Format("#box_tab1_{0}", count)'>
<li><a href='@String.Format("#box_tab2_{0}", count)'>

和在你 tab-content :

<div class="tab-pane fade" id='@String.Format("box_tab1_{0}", count)'>
<div class="tab-pane fade" id='@String.Format("box_tab2_{0}", count++)'>

注意 count++ 到增量计数器在每个循环迭代中的最后一次使用后。

赞助商