動態添加面板到Bootstrap 3手風琴

Question

我試圖動態地將Bootstrap 3面板添加到手風琴中。 我的（相關）代碼如下：

<div class="panel-group" id="queues-accordion">
</div>

和JS代碼：

$("#addqueuebutton").on("click",function(){
    var queue = '<div class="panel panel-default">';
    queue += '<div class="panel-heading">';
    queue += '<h4 class="panel-title">';
    queue += '<a data-toggle="collapse" data-parent="queues-accordion" href="collapse1">' + $('#queuename').val() + '</a>';
    queue += '</a>';
    queue += '</h4>';
    queue += '</div>';
    queue += '<div id="collapse1" class="panel-collapse collapse in">';
    queue += '<div class="panel-body">' + This is a test + '</div>';
    queue += '</div>';
    queue += '</div>';
    $('#queues-accordion').append(queue);
})

我按照本指南 - 在Bootstrap 3手風琴中添加動態閉合面板 ，但我沒有讓面板出現在頁面上。 誰能指出我的錯誤嗎？

Answer 1

以下行無效

queue += '<div class="panel-body">' + This is a test + '</div>';

This is a test字符串，應該像字符串一樣添加。 Javascript會將其解釋為變量（再次無效）。

這樣的事情應該起作用

queue += '<div class="panel-body">This is a test</div>';

或存儲This is a test作為變量並連接它

var test = 'This is a test';
queue += '<div class="panel-body">' + test + '</div>';