jquery - 如何同时实现 bootstrap Tabs 和 Collapse menu？

Question

我尝试实现 Bootstrap 选项卡和内部选项卡 BOOTSTRAP COLLAPSE。

对于标签，我实现了:

<script type="text/javascript">
$(document).ready(function()
 {  
//Redirecciona al tab, usando un prefijo al cargar por primera vez, al usar redirect en cake #_Pagos    
//Redirecciona al tab, usando #Pagos
/* Automagically jump on good tab based on anchor; for page reloads or links */
 if(location.hash) 
  {
     $('a[href=' + location.hash + ']').tab('show');         
  }


//Para evitar el bajar al nivel del tab, (al mostrarse el tab subimos)
$('a[data-toggle="tab"]').on('shown.bs.tab', function(e) 
{
    location.hash = $(e.target).attr('href').substr(1);
    scrollTo(0,0);      
});



//Actualiza el URL con el anchor o ancla del tab al darle clic
 /* Update hash based on tab, basically restores browser default behavior to
 fix bootstrap tabs */
$(document.body).on("click", "a[data-toggle]", function(event) 
  {
    location.hash = this.getAttribute("href");
  });


//Redirecciona al tab, al usar los botones de regresar y avanzar del navegador.
/* on history back activate the tab of the location hash if exists or the default tab if no hash exists */   
$(window).on('popstate', function() 
{
  //Si se accesa al menu, se regresa al tab del perfil (activo default), fixed conflict with menu
  //var anchor = location.hash || $("a[data-toggle=tab]").first().attr("href");
  var anchor = location.hash;
  $('a[href=' + anchor + ']').tab('show');

});   

});//Fin OnReady
</script>

但是每当我点击 COLLAPSE 时，页面就会向上滚动。无论如何，我可以有效地使用两者。

这是链接:http://custmr.co.uk/industry-specific/

我们点击“不动产”后，就可以去崩溃了。

提前致谢

Answer 1

你错过了阻止“ anchor ”默认事件；

例如:

$(document.body).on("click", "a[data-toggle]", function(event){
    event.preventDefault();
    location.hash = this.getAttribute("href");
  });

仅供引用

http://api.jquery.com/event.preventdefault/

anchor 元素中的“事件点击”默认调用相同的页面，如<a href="#">some foo</a>

No se por que lo escribí en inglés si tus comentarios del código están en español。