1

“显示”事件似乎不适用于动态创建的可折叠。调用 javascript 函数时，多个面板保持打开状态。单击面板标题仍然可以正常工作，如果我先手动单击面板，则“显示”方法似乎可以工作。但只有当我先点击面板标题时。有任何想法吗？

JSFiddle 示例：http: //jsfiddle.net/victoryismine06/N6rey/

//Click handler
$( "#btnOpen" ).click(function() {
  var idx = $("#idx").val();
    $("#accordion2 #collapse" + idx).collapse('show');    
});
4

1 回答 1

2

试试这个方法。

$("#btnOpen").click(function () {
    var idx = $("#idx").val();
    //Just find the data-toggle element respective to the current element and invoke the click on it.
    $("#collapse" + idx).filter(':not(.in)').prev().find('[data-toggle]').trigger('click.bs.collapse.data-api');

   //or just simply do:
   // $("#accordion2").find('[data-toggle]:eq(' + idx + ')').trigger('click.bs.collapse.data-api');

   //Or you can also do:
   //$("#accordion2 .panel-collapse.in").not($("#collapse" + idx).collapse('show')).collapse('hide');
});

演示

调用collapse方法的原因只会根据传递的类型折叠当前元素，即隐藏、显示或切换。它不处理在附加到[data-toggle]可折叠元素的自定义单击事件中处理的其他打开项目的自动折叠。即在以下部分：

$(document).on('click.bs.collapse.data-api', '[data-toggle=collapse]', function (e) {

因此，在相应元素上调用 click 事件data-toggle将处理真正的折叠场景。

于 2013-11-12T19:14:20.213 回答