JQuery Easy UI – DataGrid가 페이지 폭에 맞게 조정되는 방법
다음은 JQuery 기반 구현입니다.
/**
* JQuery ， JQuery EasyUI DataGrid 。
*/
$.fn.extend({
/**
* DataGrid ， 。
*
* @param heightMargin
* 。
* @param widthMargin
* 。
* @param minHeight
* 。
* @param minWidth
* 。
*
*/
resizeDataGrid : function(heightMargin, widthMargin, minHeight, minWidth) {
var height = $(document.body).height() - heightMargin;
var width = $(document.body).width() - widthMargin;
height = height < minHeight ? minHeight : height;
width = width < minWidth ? minWidth : width;
$(this).datagrid('resize', {
height : height,
width : width
});
}
});
사용 방법:
$(function() {
var datagridId = 'userDataGrid';
//
//
$('#' + datagridId).resizeDataGrid(20, 20, 300, 600);
// ， DataGrid
$(window).resize(function() {
$('#' + datagridId).resizeDataGrid(20, 20, 300, 600);
});
});
IE6에서 JS의 실행 효율이 낮기 때문에 DataGrid가 페이지 크기 변화에 적응할 때 DataGrid의fitColumns 속성을false로 설정하십시오. 그렇지 않으면 페이지 크기를 바꾸면 IE가 일정 시간 정지될 수 있습니다.설정 방법은 다음과 같습니다.
$('#' + datagridId).datagrid({
title: 사용자 유형,
url: 'userType.json',
fitColumns: false,
.......
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
jQuery 전후 예이 기사에서는 jquery after() 및 before() 메소드의 예를 볼 것입니다. before() 메서드는 선택한 요소 앞에 지정된 콘텐츠를 삽입합니다. after() 메서드는 선택한 요소 뒤에 지정된 콘텐츠...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
