ボタンをクリックしたときにダウンロードPDFにテキストフィールド値が表示されない
デンズB
私は初心者です。最終的にドキュメントをPDFとして保存できますが、問題は、入力したテキストフィールドのテキストがダウンロードしたPDFファイルに表示されなかったことです。これが私のコードです。
HTML
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>How To Download a DIV in a HTML Page as PDF File Using JavaScript</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/0.9.0rc1/jspdf.min.js"></script>
</head>
<body>
<!-- Content Area -->
<div id="print">
<h3>Welcome To Veewom</h3>
<p>This is a Sample Pararaph</p>
<input type="text" id="try1" placeholder="Enter Name Here">
</div>
<div id="print-btn"></div>
<button id="submit">Download PDF File</button>
</body>
</html>
JAVASCRIPT
var doc = new jsPDF();
var specialElementHandlers = {
'#print-btn': function (element, renderer) {
return true;
}
};
$('#submit').click(function () {
var fieldId = "field100";
var chars = $('#try1').val();
var chars2 = $('#try2').val();
var chars3 = $('#try3').val();
var d3 = $('[name=' + fieldId + ']:enabled').val();
diff1 = "";
if (d3) {
diff = d3;
}
$('#veewom').html('<b>'+"One"+":"+'</b>'+ chars+
'<b>'+"Two"+":"+'</b>'+chars2+
'<b>'+"Three"+":"+'</b>'+chars3
);
var source = $('#print').html();
doc.fromHTML(source, 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});
doc.save('pdf-version.pdf');
});
これはダウンロードPDFのスクリーンショットです。このpdfファイルに入力したテキストを表示したい。しかし、問題は私にそのコンテンツを与えるだけです
空の脳
このコードを試す
HTML
<input type="text" id="try1" placeholder="Enter Name Here">
<div id="print">
<h3>Welcome To Veewom</h3>
<p>This is a Sample Pararaph</p>
<p id="veewom"></p>
</div>
このjsコードを試してください
$('#submit').click(function () {
var fieldId = "field100";
var chars = $('#try1').val();
$('#veewom').html(chars);
var d3 = $('[name=' + fieldId + ']:enabled').val();
diff1 = "";
if (d3) {
diff = d3;
}
var source = $('#print').html();
doc.fromHTML(source, 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});
doc.save('pdf-version.pdf');
});
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
編集
- 前の投稿：XSDから発信されたJAXBで生成されたクラスのセットにアクセスルーチンを追加する
- 次の投稿：IQKeyboardManager –分割ビューが有効になっている場合のキーボードレイアウトが間違っている
関連記事
Related 関連記事
- 1
テキストフィールドに何かが入力されたときにドロップダウンボックスを表示する方法
- 2
ドロップダウンリストがprimefacesdatatable列フィルターボックスに表示されない
- 3
ドロップダウンリストがprimefacesdatatable列フィルターボックスに表示されない
- 4
値フィールドまたはテキストフィールドのないドロップダウンリストで[選択]をクリックしたときに、DBからラベル/テキストボックスに他の列を表示する方法
- 5
ボタンがクリックされたときにテキストフィールドとテキストエリアを追加します
- 6
AngularJsディレクティブ-リストでフィルタリングするためのドロップダウンを作成するときにローカルスコープを渡すときにディレクティブが正しくロードされない
- 7
フラッター：テキストフィールドを選択したときに画面を自動的に上にスクロールして、送信ボタンが非表示にならないようにしたいですか？
- 8
EXTJSのモーダルウィンドウでボタンがクリックされたときに、メインウィンドウでストアをリロード/グリッドを更新します
- 9
ドロップダウンリンクをクリックすると、選択したテキストがボタンに表示されます
- 10
Typescript、ボタンがクリックされたときにブートストラップドロップダウンが閉じないようにする
- 11
セッタールーチンの後に値が表示されないDatagridのテキストボックスへのプロパティのバインド
- 12
ボタンがクリックされた後にテキストフィールドの値がクリアされるのはなぜですか？
- 13
ユーザーがドロップダウンリストから値を選択したときにテキストフィールドにデータベース値を表示する方法
- 14
Android：フォーカスされていないときに輪郭が表示されるドロップダウンを公開したマテリアルのヒントテキストの色を変更する
- 15
Android：フォーカスされていないときに輪郭が表示されるドロップダウンを公開したマテリアルのヒントテキストの色を変更する
- 16
選択リストをフィルタリングしたい。ドロップダウンに、スケジュールされているクラスと同じクラスに登録されている学生のみを表示したい
- 17
ドロップダウンマテリアルのUIアイテムを含むテキストフィールドにReactJSが表示されない
- 18
ネストされたスクロールウィンドウ内のスティッキーHTML要素が正しくレンダリングされない
- 19
4つのドロップダウンがあり、ページが読み込まれたときに非表示にしたいのですが、[追加]ボタンをクリックすると、1つのドロップダウンが表示されます。
- 20
コードを入力したときにドロップダウンにテキストが表示されないのはなぜですか
- 21
テキストフィールドに「いくつかの」テキストがある場合にボタンを無効にし、そのテキストがテキストフィールドに表示されなくなったときにボタンを再度有効にする方法
- 22
Angular / Typescriptでボタン/アイコンがクリックされたときにテキストフィールドを入力フィールドにするにはどうすればよいですか？
- 23
ボタンがクリックされたときに、ティブルとドロップダウンを更新します。ドロップダウンで選択が行われたときに、ティブルを更新します
- 24
PHPでドロップダウン値が選択されているときにテキストボックスの値を表示する
- 25
ドロップダウンリストがaspmvcのjqueryで変更されたときにリストボックスにデータを入力します
- 26
ドロップダウンリストがaspmvcのjqueryで変更されたときにリストボックスにデータを入力します
- 27
ユーザーがプログラムでSwiftiosのDeleteボタンをクリックしたときに、カーソルをあるテキストフィールドから別のテキストフィールドに自動的に移動するにはどうすればよいですか？
- 28
ボタンがクリックされたときにポップアップしてからフェードアウトするテキストhtml
- 29
ユーザーがボタンxをクリックしたときに、入力フィールドxにテキストを追加します
コメントを追加