将手风琴组动态添加到 Twitter Bootstrap 手风琴不会被手风琴识别

Question

在我当前的项目中，我有许多选项卡，每个选项卡都显示不同的手风琴，其中包含潜在客户通过网络提出的请求。每个选项卡代表一个工作流阶段。在第一个选项卡中，我有一个手风琴，一旦请求（手风琴组）被用户“声明”，它就会从当前的手风琴中删除并附加到下一个选项卡中的手风琴。此功能工作正常。我遇到的问题是新的父手风琴似乎没有认识到添加了一个新的手风琴组，因此我能够独立于手风琴中的其他手风琴组扩展该手风琴组。如果我展开其中一个，它会崩溃，但如果我将它展开回来，已经展开的其他人不会像他们应该的那样崩溃。刷新页面后这个问题就消失了，但我试图避免这种情况。

所有手风琴组都正确设置了数据父级。我什至在我移动的手风琴组上更改了 data-parent 的值，所以它也是正确的。

感谢您的帮助:)

编辑添加在用户声明请求时调用的代码

define(['jquery', 'util', 'text!../templates/alert.html!strip', 'models/Claimer', 'models/RateQuote'], function($, util, tAlert) {
  return {
    /**
     * Claim an unclaimed request.
     *
     * @param row The request row.
     * @param id The request ID.
     * @param name The user's name who is claiming the request.
     * @param newActions Array of actions to replace the existing actions menu.
     */
    claim: function(row, id, name, newActions) {
      var claimer = new Claimer(name);

      $.ajax({
        url: '/webrequests/request/claimRequest/' + id,
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify(claimer),
        success: function(data) {
          if($(row).siblings().length == 0)
            util.noData(row.parent('.accordion'));

          $(row).children('.accordion-heading').children('.accordion-toggle').attr('data-parent', '#claimed-by-me-accordion');

          var claimedByMeAccordion = $('#claimed-by-me-accordion');
          $(claimedByMeAccordion).children('.no-data').remove();

          $(row).appendTo(claimedByMeAccordion);

          $('.createDate', row).html('No response sent').removeClass('createDate').addClass('respondDate');
          $('.actions', row).children().remove();
          $('.actions', row).append(newActions);
        }
      });
    },

Answer 1

Bootstrap 会在加载时自动将 DOM 中的所有内容转换为适当的小部件类型，但它不会监听添加到 DOM 中的新元素。为此，您需要在添加新行后手动指定它是可折叠的。幸运的是，这应该很简单。尝试将 .collapse() 附加到 appendTo 中，如下所示：

$(row).appendTo(claimedByMeAccordion).collapse();

另请参阅文档：http://twitter.github.io/bootstrap/javascript.html#collapse