Question

我曾经有过Twitter Bootstrap标签。

我可以用以下内容切换div内容：

 <ul class="tabs" data-tabs="tabs" >
                <li class="active"><a href="#home">Home</a></li>
                <li><a href="#files">Files</a></li>
                <li><a href="#help">Help</a></li>


       </ul>

    <script type="text/javascript">

    $('#.tabs').bind('change', function (e) {
        e.target // activated tab
        e.relatedTarget // previous tab
    })
</script>

现在我想将此功能移至菜单条：

<div class="topbar">
      <div class="topbar-inner">
        <div class="container-fluid">
          <ul class="nav">
            <li><a class="add_folder">Add</a></li>
            <li><a class="remove_folder">Remove</a></li>
            <li><a class="rename_folder">Rename</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>

          </ul>
          <p class="pull-right">Logged in as <a href="#">username</a></p>
        </div>
      </div>
    </div>

更新我设法做了以下事情：

$(document).ready(
function()
{
topbarLinks = $(".nav li");
if (topbarLinks.length > 0)
{
topbarLinks.attr({"onclick" : "topbarItem_OnClick()"});
}

});

function topbarItem_OnClick(event, data)
{
alert("bla");
};

whay将是交换内容的最佳方式吗？

TIA

Answer 1

最后我用过：

$(document).ready(
function()
{
topbarLinks = $(".nav li a").attr({"onclick" : "topbarItem_OnClick(this.href)"});
});

function topbarItem_OnClick(href)
{

//$(".pill-content").find('*[style]').each(function(index){
//    this.hide();
//});

$(".pill-content>div").hide();
var indexOfHash = href.indexOf("#");
var selected = href.substring(indexOfHash);
$(selected).show();


};

Twitter Bootstrap：topbar strip更改内容div

1 个答案: