0

我在一个页面中有多个选项卡，每个选项卡都有在运行时创建的不同 ID，所以

<div class="span5" id="@model.Id">

        <ul class="nav nav-tabs">
            <li class="active"><a data-toggle="tab" onclick="$('#@model.Id #review').focus();">Review</a></li>
            <li><a data-toggle="tab" href="#@model.Id #awesomediv1">Web</a></li>
            <li><a data-toggle="tab" href="#@model.Id #awesomediv2">Photos</a></li>
            <li><a data-toggle="tab" href="#@model.Id #awesomediv3">Location</a></li>
            <li><a data-toggle="tab" href="#@model.Id #awesomediv4">Map</a></li>
        </ul>
<div class="tabbable">
            <div class="tab-content">

                <div class="tab-pane active" id="awesomediv1">
                   .....
                </div>
...

目前，当我更改任何选项卡中的选项卡时，只有第一个选项卡会更改。我希望锚标记导航到外部 div 的相应 div。例如，在 jquery 中，类似的东西$('#1 awesomediv1')给了我想要导航到的正确 div。但这似乎不适用于href。

该模型来自asp.net mvc。

4

1 回答 1

0

我使用以下方法解决了它

function activateCorrectDiv(parent, e) {
        $('.tab-pane').removeClass('active');
        $('#' + parent+ ' #' + e).addClass('active');
    };

<a  data-toggle="tab" onclick="activateCorrectDiv(($(this).closest('div').attr('id')),'awesomediv1')">

这个想法是确定哪个 div 需要处于活动状态。然后使其处于活动状态，在此之前只需确保其他所有内容均不活动。顺便说一句，active 是一个 CSS 类。选择器是 $(#parentid #childid) ，注意它们之间的空间。

这可能只是一个黑客，但它有效！

于 2013-05-21T19:06:02.360 回答