31
私はjsPDFを使いこなすのは初めてですが、私の人生にとってはこの事に適用するCSSを手に入れることはできません！私はインライン、内部、外部をすべて無駄にしようとしました！私はそれが技術的に印刷物をファイルに印刷しているので、印刷スタイルシートが必要で、それもうまくいきませんでした。jsPDFはどんなスタイリングでも動作しません
私はちょうどで動作するように任意のCSSを取得しようとしている非常に基本的なページがあります。 JS：
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="jspdf.js"></script>
<script type="text/javascript" src="./libs/FileSaver.js/FileSaver.js"></script>
<script type="text/javascript" src="./libs/Blob.js/BlobBuilder.js"></script>
<script type="text/javascript" src="jspdf.plugin.standard_fonts_metrics.js"></script>
<script type="text/javascript" src="jspdf.plugin.split_text_to_size.js"></script>
<script type="text/javascript" src="jspdf.plugin.from_html.js"></script>
<script>
$(document).ready(function(){
$('#dl').click(function(){
var specialElementHandlers = {
'#editor': function(element, renderer){
return true;
}
};
var doc = new jsPDF('landscape');
doc.fromHTML($('body').get(0), 15, 15, {'width': 170, 'elementHandlers': specialElementHandlers});
doc.output('save');
});
});
</script>
はHTML：
<body>
<div id="dl">Download Maybe?</div>
<div id="testcase">
<h1>
We support special element handlers. Register them with jQuery-style
</h1>
</div>
</body>
そして最後に外部にあるスタイルシートを：
h1{
color: red;
}
div{
color: red;
}
すべてが正しく組み込まれていることと、n oエラーは、すでにすべてをチェックしています。 CSSがうまく動作するためには、私が呼び出す必要があるいくつかの余分な機能がありますか？私に教えてください！どうもありがとう！あなたが持っているかもしれない他のヒントも高く評価されています！
EDIT：
<html>
<head>
<link rel="stylesheet" href="print.css" type="text/css" media="print"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="jspdf.js"></script>
<script type="text/javascript" src="./libs/FileSaver.js/FileSaver.js"></script>
<script type="text/javascript" src="./libs/Blob.js/BlobBuilder.js"></script>
<script type="text/javascript" src="jspdf.plugin.standard_fonts_metrics.js"></script>
<script type="text/javascript" src="jspdf.plugin.split_text_to_size.js"></script>
<script type="text/javascript" src="jspdf.plugin.from_html.js"></script>
<script>
$(document).ready(function(){
$('#dl').click(function(){
var specialElementHandlers = {
'#editor': function(element, renderer){
return true;
}
};
var doc = new jsPDF('landscape');
doc.fromHTML($('body').get(0), 15, 15, {'width': 170, 'elementHandlers': specialElementHandlers});
doc.output('save');
});
});
</script>
</head>
<body>
<div id="dl">Download Maybe?</div>
<div id="testcase">
<h1>
We support special element handlers. Register them with jQuery-style
</h1>
</div>
</body>
</html>
コンソールに何かエラーがありますか？つまり - すべてのリソースが正しく読み込まれていますか？ 。 私が尋ねる理由は、私の開発環境では、「//ajax.googleapis.com」が「h t t p：//ajax.googleapis.com」の問題を引き起こしているからです。その点：開発スタックについてもっと教えてください。どのようにページはWAMP、MAMP、RoRails、Nodeにレンダリングされていますか？これが重要であるかどうかは分かりませんが、誰が知っていますか？ – sdailey
すべてがロードされています。単純な.htmlファイルです。 – samuraiseoul
私はあなたのコードをすべて必要と思っていますか、それともどこかにアップロードできますか？なぜなら、私がコードを使用すると、あなたはスタイリングを提供してもうまく動作するからです。 – Jarno