title: How to disable other tabs while loading any tab in bootstreap3
body: <p>I am using following tab to load remote tab.</p>
  
  <p>Here I want to load first tab default(after loading the page)  and while loading any tab other tabs should be disabled.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"&gt;
  
  &lt;!-- Optional theme --&gt;
  &lt;link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"&gt;
  
  &lt;!-- Latest compiled and minified JavaScript --&gt;
  &lt;script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"&gt;&lt;/script&gt;
  
  &lt;ul class="nav nav-pills"  id="tab"&gt;
      &lt;li&gt;&lt;a href="http://www.google.com" data-target="#Google" class="media_node active span" id="info_tab" data-toggle="tabList" rel="tooltip"&gt; Google &lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;&lt;a href="http://www.yahoo.com"  data-target="#Yahoo" class="media_node span" id="posts_tab" data-toggle="tabList" rel="tooltip"&gt; Yahoo&lt;/a&gt;
     &lt;/li&gt;
  &lt;/ul&gt;
     &lt;div class="tab-content"&gt;
     &lt;div class="tab-pane active" id="Google"&gt;Click to load&lt;/div&gt;                  &lt;div class="tab-pane" id="Yahoo"&gt;Loading&lt;/div&gt;
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  
  How to achive this?</p>