javascript - 特定のタブが表示されているときに要素を非表示にする方法

Question

私はTwitterBootstrapを使用しており、タブの実装に成功しました。1つを除くすべてのタブに表示されるボタンがありますが、どのようにすればよいですか？

<div class="span6 offset1"> 
  <div class="tabbable">
    <ul class="nav nav-tabs">
      <li class="active"><a href="#general" data-toggle="tab">General</a></li>
      <li><a href="#example2" data-toggle="tab">Example2</a></li>
      <li><a href="#example3" data-toggle="tab">Example3</a></li>
    </ul>

    <div class="tab-content">
      <div id="general" class="tab-pane fade in active" >
       //content
      </div>
      <div id="example2" class="tab-pane fade" >
       //content
      </div>
      <div id="example3" class="tab-pane fade" >
       //content
      </div>
    </div>
 </div> 
 <input type="submit" style="width:120px" class='btn btn-primary' id="update" value="Update"/> 
</div>

タブexample3が表示されているときに更新ボタンが非表示になるようにプログラムするにはどうすればよいですか。ただし、タブgeneralとexample2が表示されているときはページに残ります。

ありがとう！

Answer 1

ブートストラップタブで発生しているイベントがあるかどうかはわかりません。ただし、最も簡単な方法は、example3リンクでmouseclickイベントを使用することです。または、カスタムイベントをトリガーすることもできます。

$('a[href="#example3"]').on('click',function(){
 $("#update").hide();
});

Answer 2

使用する.style.display = 'none'

例えば

document.getElementById(id).style.display = 'none';