Javascript BS 3在单击链接并显示选项卡时获取数据属性值

我使用的是BS3，有如下选项卡：

<ul class="nav nav-tabs">
  <li class="active"> 
    <a id="tab-1" href="#annual_summary" data-toggle="tab">Annual Summary </a> 
  </li>
  <li> 
    <a id="tab-2" href="#monthly_summary" data-toggle="tab">Monthly Summary 
    </a> 
  </li>
</ul>

在

tab-2

中，我有以下html标记：

<div class="header-wrapper">
  <input type="hidden" name="id" id="id">
  <p class="header-title">Year:
    <span class="header-text" id="header_year"></span>
  </p>
  <p class="header-title">Month:
    <span class="header-text" id="header_month"></span>
  </p>
</div>

但似乎不起作用：(

请帮我…谢谢

已更新

这是我的工作代码：

  var id;
  var year;
  var month;

    //move to tab 2 when assignment button clicked
      $("a[data-tab-destination]").on('click', function() {

        id = $(this).data('id');
        year =  $(this).data('year');
        month = $(this).data('month');
        var tab = $(this).attr('data-tab-destination');
        $("#" + tab).click();
        $("html, body").animate({
          scrollTop: 0
        }, 500);
      });

      //TAB ON SHOW
      $("a[href='#monthly_summary']").on('show.bs.tab', function() {
           $('#id').attr("value", id);
           $('#header_year').html(year);
           $('#header_month').html(month);
      });

尝试使用

div.data（'year'）

而不是

div.data（'year\u filtered'）；

还可以尝试使用

div.attr（'data-year'）

而不是

div.data（'year'）

（仔细查看

attr

）

---

编辑： 给链接加个id怎么样

<a href="javascript:;" class="btn default btn-xs default button-action" 
   id="a-tab-1"
   data-id="1" 
   data-year="2014" 
   data-month="January" 
   data-tab-destination="tab-2">
  <i class="fa fa-pencil"></i> Monthly Summary
</a>

尝试使用

div.data（'year'）

而不是

div.data（'year\u filtered'）；

还可以尝试使用

div.attr（'data-year'）

而不是

div.data（'year'）

（仔细查看

attr

）

---

编辑： 给链接加个id怎么样

<a href="javascript:;" class="btn default btn-xs default button-action" 
   id="a-tab-1"
   data-id="1" 
   data-year="2014" 
   data-month="January" 
   data-tab-destination="tab-2">
  <i class="fa fa-pencil"></i> Monthly Summary
</a>

---

我的错我忘了更改为月份和年份。但仍然不起作用…我编辑了上面的代码：（我的错我忘了更改为月份和年份。但是仍然不起作用…我编辑了上面的代码：（@jperelli仍然不适用于

var year=div.attr（'data-year'））

当我提醒

年份

时，它返回

未定义

@jperelli仍然无法使用

var year=div.attr（'data-year'）

当我提醒

年份

时，它返回

未定义

。

  var id;
  var year;
  var month;

    //move to tab 2 when assignment button clicked
      $("a[data-tab-destination]").on('click', function() {

        id = $(this).data('id');
        year =  $(this).data('year');
        month = $(this).data('month');
        var tab = $(this).attr('data-tab-destination');
        $("#" + tab).click();
        $("html, body").animate({
          scrollTop: 0
        }, 500);
      });

      //TAB ON SHOW
      $("a[href='#monthly_summary']").on('show.bs.tab', function() {
           $('#id').attr("value", id);
           $('#header_year').html(year);
           $('#header_month').html(month);
      });

<a href="javascript:;" class="btn default btn-xs default button-action" 
   id="a-tab-1"
   data-id="1" 
   data-year="2014" 
   data-month="January" 
   data-tab-destination="tab-2">
  <i class="fa fa-pencil"></i> Monthly Summary
</a>

// var div = $(event.relatedTarget)
var div = $('#a-tab-1')