Question

我正在尝试让JScrollPane重新初始化我的手风琴here的展开/折叠。你可以通过点击其中一个父母（石头瓷砖，石头水槽，石墙等）来演示手风琴。

现在我使用以下JQuery将其设置为单击事件...

var pane = $('.menuwrap')
pane.jScrollPane();
var api = pane.data('jsp');
var i = 1;

$("ul#widget-collapscat-5-top > li.collapsing").click(function() {
    $(this).delay(3000);
    api.reinitialise();
});

当您第二次单击父级而不是第一次时，它似乎有效。我不知道为什么，但我开始尝试编辑手风琴的JS，以便在崩溃完成时添加此功能（而不是尝试执行此单击解决方法）。可以查看崩溃JS here。

我试图在这里为重新初始化函数添加JS，但我认为我没有做正确的事情。

请你指出我正确的方向？

谢谢！

Answer 1

也许您可以更改addExpandCollapse函数，以便在每次点击操作结束时调用reinitialise函数：

function addExpandCollapse(id, expandSym, collapseSym, accordion) {
  jQuery('#' + id + ' .expand').live('click', function() {
    if (accordion==1) {
      var theDiv = jQuery(this).parent().parent().find('span.collapse').parent().find('div');
      jQuery(theDiv).hide('normal');
      jQuery(this).parent().parent().find('span.collapse').removeClass('collapse').addClass('expand');
        createCookie(theDiv.attr('id'), 0, 7);
    }
    jQuery('#' + id + ' .expand .sym').html(expandSym);
    expandCat(this, expandSym, collapseSym);

    api.reinitialise(); // HERE

    return false;
  });
  jQuery('#' + id + ' .collapse').live('click', function() {
    collapseCat(this, expandSym, collapseSym);

    api.reinitialise(); // and HERE

    return false;
  });
}

为了更加安全，请确保在上面的代码前面有var api = pane.data('jsp');行。

Answer 2

api.reinitialise()正常运作。发生的事情是它在您单击时更新大小，此时元素尚未展开。您可能会注意到，如果您展开，折叠并再次展开同一部分，则不会发生任何事情。但是，如果展开一个然后单击另一个，ScrollPane将调整为第一个展开元素的大小。

您可以使用以下事件解决此问题：在合作结束时放置$(this).trigger('colapseComplete')。然后你可以使用：

//Listening to the colapseComplete event we triggered above
$("#widget-collapscat-5-top > li.collapsing").on('colapseComplete', function() {
  api.reinitialise();
});

JScrollPane插件 - 重新初始化崩溃

2 个答案: