Как сохранить таблицу начальной загрузки в липке в Div с динамическими данными? ⇐ Jquery

[Anonymous]

Я использую Bootstrap-table и динамически Добавление моих наборов в таблицу (включая заголовки) -Детер-для стола-в-бутстрапа и другие связанные посты, но нет удачи. M Прокрутка всего документа, но когда я хочу, чтобы моя таблица находилась в контейнере Div, он больше не работает. Br /> (я разместил данные для примеров, но в действительности я использую Ajax, чтобы вызвать все данные, , затем < /em> инициализируя таблицу после этого, поэтому я ничего не пишу внутри Таблица в HTML вообще, и мне нужно, чтобы она оставалась таким образом) < /p>
Но после init заголовок больше не придерживается. < /p>
липкий не работает на этой картинке
желаемый результат: заголовок остается в верхней части Div при прокрутке внутри
< P> Я новичок в StackOverflow, поэтому я не уверен, что я делаю это правильно, я не смог бы превратить это в скрипку, но вот мой код, заранее спасибо. < /p>

Код: Выделить всё

$(document).ready(function () {
var columns = [
{
field: "name",
title: "Name"
},
{
field: "age",
title: "Age"
},
{
field: "city",
title: "City"
}
];

var data = [
{ name: "John Doe", age: 28, city: "New York" },
{ name: "Jane Smith", age: 34, city: "Los Angeles" },
{ name: "Jane Smith", age: 34, city: "Los Angeles" },
{ name: "Jane Smith", age: 34, city: "Los Angeles" },
{ name: "Jane Smith", age: 34, city: "Los Angeles" },
{ name: "Mike Johnson", age: 45, city: "Chicago" },
{ name: "Sarah Lee", age: 30, city: "Miami" }
];

// init table
$("#RealTable").bootstrapTable({
data: data,
columns: columns
});
});< /code>
.divA {
width: 100%;
max-height: 200px; /* 設定 divA 高度為 50vh */
overflow: auto; /* 允許內部內容捲動 */
background-color: #e0e0e0;
padding: 20px;
position: relative; /* 需要這個來使 sticky 正常工作 */
}

/* 讓整個 table 設置 sticky */
#RealTable {
position: relative;
z-index: 1; /* 確保表格始終顯示 */
border-collapse: separate;
border-spacing:0;
text-align:center;
}

.sticky-header th {
position: sticky !important;
top: 0;
background-color: turquoise;
color: white;
z-index: 30 !important; /* 確保標題始終位於其他內容上方 */
}
.sticky-header th .th-inner {
position: sticky !important;
top: 0;
}

th,
td {
padding: 10px;
border: 1px solid #ddd;
text-align: center;
}

.content {
padding: 0px 0px 50px 0px;
}

.table {
width: 100%;
border: 1px solid #ddd;
text-align: center;
}< /code>





Sticky Header with Bootstrap Table










title
qweqwewq












title2
qweqwewq
qweqwewq
qweqwewq

Подробнее здесь: https://stackoverflow.com/questions/794 ... namic-data