51 lines
2.0 KiB
JavaScript
51 lines
2.0 KiB
JavaScript
|
|
function checkForm() {
|
|||
|
|
alert('eee');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|||
|
|
// 页面内容溢出检测函数
|
|||
|
|
function checkPageOverflow() {
|
|||
|
|
// 获取所有页面元素
|
|||
|
|
var pages = document.querySelectorAll('.page');
|
|||
|
|
|
|||
|
|
pages.forEach(function(page) {
|
|||
|
|
// 获取页面内容高度
|
|||
|
|
var contentHeight = 0;
|
|||
|
|
Array.from(page.children).forEach(function(child) {
|
|||
|
|
contentHeight += child.offsetHeight;
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 获取页面可用高度 (减去内边距)
|
|||
|
|
var pageStyles = window.getComputedStyle(page);
|
|||
|
|
var paddingTop = parseFloat(pageStyles.paddingTop);
|
|||
|
|
var paddingBottom = parseFloat(pageStyles.paddingBottom);
|
|||
|
|
var availableHeight = page.offsetHeight - paddingTop - paddingBottom;
|
|||
|
|
|
|||
|
|
// 检查是否溢出
|
|||
|
|
if (contentHeight > availableHeight) {
|
|||
|
|
page.setAttribute('data-overflow', 'true');
|
|||
|
|
|
|||
|
|
// 如果下一个元素不是 page-break,添加一个
|
|||
|
|
var nextElement = page.nextElementSibling;
|
|||
|
|
if (!nextElement || !nextElement.classList.contains('page-break')) {
|
|||
|
|
var pageBreak = document.createElement('div');
|
|||
|
|
pageBreak.className = 'page-break';
|
|||
|
|
page.parentNode.insertBefore(pageBreak, page.nextSibling);
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
page.removeAttribute('data-overflow');
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 初始检查
|
|||
|
|
checkPageOverflow();
|
|||
|
|
|
|||
|
|
// 窗口大小改变时重新检查
|
|||
|
|
window.addEventListener('resize', checkPageOverflow);
|
|||
|
|
|
|||
|
|
// 图片加载后重新检查(图片会影响内容高度)
|
|||
|
|
document.querySelectorAll('img').forEach(function(img) {
|
|||
|
|
img.addEventListener('load', checkPageOverflow);
|
|||
|
|
});
|
|||
|
|
});
|