相关疑难解决方法(0)

Twitter引导选项卡和javascript事件

我正在为项目使用twitter bootstrap - 特别是它的tab功能(http://twitter.github.com/bootstrap/javascript.html#tabs)

现在我有了这个tablist,当我按下它时,它会切换到每个标签的内容.但是,此内容已预先加载到页面中(所有选项卡的内容的html代码已经存在,您只需按下选项卡即可更改可见性).

但是,我只想在按下某个选项卡时动态加载内容,因此在加载整个页面时,将获得最新数据而不是数据.

我打算为此使用jQuery.但是,如何在按下选项卡时调用某个jquery函数?

我试图在单击选项卡时显示警告(如果可行,jQuery函数也会),但即使这样也不起作用:

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="http://twitter.github.com/bootstrap/1.4.0/bootstrap-tabs.js"></script>
<script type="text/javascript">
$(function() {
    $('.tabs').bind('click', function (e) {
        e.target(window.alert("hello"))
    });
});
</script>
Run Code Online (Sandbox Code Playgroud)

而我的HTML:

<ul class="tabs" data-tabs="tabs">
  <li class="active"><a href="#tab1">tab 1</a></li>
  <li><a href="#tab2">tab 2</li>
</ul>

<div id="my-tab-content" class="tab-content">
  <div class="tab-pane" id="tab1">
      <h1>Tab1</h1>
      <p>orange orange orange orange orange</p>
  </div>
  <div class="tab-pane" id="tab2">
     <h1>Tab2</h1>
     <p>blue blue blue blue blue</p>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

有关如何使这项工作的任何想法?

请参阅twitter bootstrap选项卡的工作原理:(http://twitter.github.com/bootstrap/javascript.html#tabs)及其使用的js文件:http: //twitter.github.com/bootstrap/1.4. 0 /自举-tabs.js

javascript jquery twitter-bootstrap

60
推荐指数
3
解决办法
10万
查看次数

标签 统计

javascript ×1

jquery ×1

twitter-bootstrap ×1