Question

我需要根据bootstrap jQuery选项卡部分中的选定选项卡“重置”一些页面信息。

文档显示了此事件，这正是我所需要的：http://twitter.github.com/bootstrap/javascript.html#tabs

$('a[data-toggle="tab"]').on('shown', function (e) {
  e.target // activated tab
  e.relatedTarget // previous tab
})

我需要获取e.Target和e.relatedTarget的'href'属性，该属性唯一标识这两个标签以及它们链接到的2个标签内容窗格。

这是我的问题：e对象是我不期望或习惯的对象。我不能使用任何jQuery方法，如e.target.attr('href') - 我以前使用的所有常规jquery方法都已消失。我尝试像原始对象属性e.href一样访问它，并且https://127.0.0.1/test?action=view#tab-a"没有#tab-a

我可以编写一个解决方法 - 但我显然做错了。应该有一种简单的方法直接从#tab-a获取e.target - 但我无法弄明白。

Answer 1

请尝试$(e.target).attr('href')。

Answer 2

在这里参加晚会是我的看法：

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {

    e.currentTarget ...

});

e.currentTarget是刚刚点击的当前锚点

Answer 3

如果有人需要知道当前选择了哪个标签索引而没有在DOM中手动计算它。

用例当#hrefs动态更新时，您可以在标签索引上进行转发。

jQuery函数.index()返回整数，指示jQuery对象中第一个元素相对于其兄弟元素的位置。

var el = jQuery('#some .thing'); // some DOM node that contains tab html structure
var tab_list = el.find('.tabbable').first().find('a[data-toggle="tab"]');
// event namespace ".bs.tab" is important in some versions of Bootstrap 
tab_list.on('shown.bs.tab', function(e){

    // zero based index
    // jQuery function `.index()` returns zero-based DOM "order" index
    tab_index = $(e.target).parent().index();

    // store this index to cookie or somwhere
    // so that you can show that tab again when user comes back to page
    // or makes a page refresh (F5)
});

Answer 4

这些都应该有用。

$(e.target).attr('href');
e.target.hash;
$(this).attr('href');
this.hash

Twitter Bootstrap - 对标签“显示”事件执行操作

4 个答案: