Comment utiliser JS pour implémenter l'impression de pagination-js tutoriel-php.cn

Comment utiliser JS pour implémenter l'impression de pagination

php中世界最好的语言

Libérer： 2018-05-29 10:40:00

original

3054 Les gens l'ont consulté

Cette fois, je vais vous montrer comment utiliser JS pour implémenter l'impression de pagination. Quelles sont les précautions pour utiliser JS pour implémenter l'impression de pagination. Voici des cas pratiques, jetons un coup d'œil.

Lors de l'appel window.print(), l'effet d'impression peut être obtenu, mais lorsqu'il y a trop de contenu, l'impression de la page est requise.

Il existe plusieurs styles d'impression spécifiés dans les propriétés style

page-break-before et page-break-after qui ne modifieront pas l'affichage de la page web à l'écran. Ces deux propriétés servent à contrôler. Comment le fichier est imprimé.

Chaque attribut d'impression peut être défini sur 4 valeurs de réglage : automatique, toujours, gauche et droite. Parmi eux, Auto est la valeur par défaut. Les sauts de page doivent être définis uniquement lorsque cela est nécessaire.

Si page-break-before est défini sur toujours, l'imprimante redémarrera une nouvelle page d'impression lorsqu'elle rencontrera un composant spécifique.

Si page-break-before est défini sur gauche, les symboles de saut de page seront insérés jusqu'à ce que le composant spécifié apparaisse sur une page vierge laissée.

Si page-break-before est défini sur la droite, les symboles de saut de page seront insérés jusqu'à ce que le composant spécifié apparaisse sur une page vierge à droite.

L'attribut page-break-after ajoutera le symbole de saut de page après le composant spécifié, pas avant.

Vous pourrez voir le paramétrage de ces propriétés dans le programme suivant,

<HTML>
　　<HEAD>
　　　　<TITLE>Listing 14-4</TITLE>
　　</HEAD>
　　<BODY>
　　　　<p>This is the first p.</p>
　　　　<p STYLE="page-break-before:always">This is the second p.</p>
　　　　<p STYLE="page-break-after:always">This is the third p.</p>
　　　　<p>This is the fourth p.</p>
　　　　<p STYLE="page-break-before:right">This is the fifth p.</p>
　　　　<p STYLE="page-break-after:right">This is the sixth p.</p>
　　　　<p>This is the last p.</p>
　　</BODY>
</HTML>

Copier après la connexion

值	描述
auto	默认值。如果必要则在元素前插入分页符
always	在元素前插入分页符
avoid	避免在元素前插入分页符
left	在元素之前足够的分页符，一直到一张空白的左页为止
right	在元素之前足够的分页符，一直到一张空白的右页为止
inherit	规定应该从父元素继承 page-break-before 属性的设置

Dans l'objet Dom , l'attribut pageBreakBefore

Grammaire :

Object.style.pageBreakBefore=auto|always|avoid|left|right

<html>
　　<head>
　　　　<script type="text/javascript">
　　　　　　function setPageBreak()
　　　　　　{
　　　　　　　　document.getElementById("p2").style.pageBreakBefore="always";
　　　　　　}
　　　　</script>
　　</head>
　　<body>
　　　　<p>This is a test paragraph.</p>
　　　　<input type="button" onclick="setPageBreak()" value="Set page-break" />
　　　　<p id="p2">This is also a test paragraph.</p>
　　</body>
</html>

Copier après la connexion

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres. articles sur le site PHP chinois !

Lecture recommandée :

Comment gérer l'erreur d'économie d'installation sur Mac due au bison

Comment gérer correctement Taobao cnpm après l'installation de cnpm, il n'y a pas de commandes internes ou externes

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!