Слияние кода завершено, страница обновится автоматически
jquery.dataTable
jquery 数据表格
| Конфигурация dataTable | Описание | Опции |
| debug | Режим отладки, по умолчанию выключен | bool, false-true |
| method | Способ отправки данных, по умолчанию GET | string, get-post |
| serial | Генерировать ли номера строк, по умолчанию да | bool, false-true |
| check | Включать ли флажки в строках, по умолчанию нет | bool, false-true |
| pageCapacity | Количество строк на странице, по умолчанию 10 | int, положительное целое число |
| loading | Отображать ли анимацию загрузки, по умолчанию да | bool, false-true |
| url | URL для получения данных в формате JSON, без него можно только создать заголовки таблицы | string |
| style | Настройка стиля таблицы, можно написать собственный CSS, формат {«font-size»: «12px», «width»: «800px»} | object |
| align | Направление выравнивания содержимого, по умолчанию влево | string: center, left, right |
| ButtonStyle | Стиль кнопок, цвет шрифта и фона, по умолчанию чёрный | object |
| oddEven | Отличать чётные и нечётные строки, по умолчанию включено | bool, false-true |
| sign | Показывать ли знак выделения при щелчке по строке, по умолчанию включён | bool, false-true |
| rowspan="5" | columns | Имя связанного поля, обязательно для столбцов с данными, для пользовательских столбцов необязательно | string | | title | Заголовок столбца | string | | width | Ширина столбца | int, положительное целое число | | button | Пользовательская кнопка, имя кнопки задаётся этим свойством, для пользовательских колонок обязательно | string | | buttonName | Название пользовательской кнопки, для пользовательских колонок необязательно | string |
События dataTable
| Событие | Описание | Использование |
|---|---|---|
| Click | Событие клика по строке, возвращает данные этой строки | Click: function (row){alert(row.id);} |
| doubleClick | Событие двойного клика по строке, возвращает данные этой строки, не вызывает событие Click | doubleClick: function (row){alert(row.id);}; |
| Пользовательский Click | Клика по кнопке, возвращает данные строки, если кнопка имеет значение del, то событие называется delClick | ПользовательскийClick:function (row) {alert(row.id);} |
Использование
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="jquery.dataTable.js"></script>
<table id="table"></table>
$("#Table").dataTable({
debug: true,
check: true,
pageCapacity:15,
loading:false,
oddEven:false,
url: "data.php",
style: {"font-size": "12px", "width": "800px"},
align:"center",
ButtonStyle:{fontColor:"#ffffff",backgroundColor:"#10AA9C"},
columns: [
{ColumnName: "id", title: "ID", width: 30},
{ColumnName: "name", title: "视频名", width: 500}
});
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )