尝试使用Intel XDK保存PDF文件 [英] Trying to save a PDF file with Intel XDK
问题描述
我正在尝试重新创建此示例.
但是当我单击按钮时，出现错误:未捕获的ReferenceError:未定义LocalFileSystem".
But When I click the button I get the error: "Uncaught ReferenceError: LocalFileSystem is not defined".
这是我的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jsPDF</title>
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/jspdf.js"></script>
<script src="js/FileSaver.js"></script>
<script src="js/html2canvas.js"></script>
<script>
function guardar(){
var pdf = new jsPDF('p', 'pt', 'a4');
var source = $('#tabelagastos')[0];
var PDFFILE ='';
var arquivo = prompt("Qual o nome do arquivo?");
pdf.specialElementHandlers = {
'#bypassme': function (element, renderer) {
return true;
}
};
pdf.fromHTML(source, 15, 15, {'width': 170},
function (dispose) {
PDFFILE = pdf.output();
});
//NEXT SAVE IT TO THE DEVICE
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSystem) {
fileSystem.root.getFile(arquivo +".pdf", {create: true}, function(entry) {
var fileEntry = entry;
entry.createWriter(function(writer) {
writer.onwrite = function(evt) {
alert("Save (root folder)!");
};
writer.write( PDFFILE );
}, function(error) {
alert(error);
});
}, function(error){
alert(error);
});
},
function(event){
alert( evt.target.error.code );
});
}
</script>
</head>
<body>
<h1>EJEMPLO DE JSPDF</h1>
<hr />
<div id="tabelagastos">some text</div>
<input type="button" id="iniciador" value="Guardar" onclick="guardar();">
</body>
推荐答案
这是对您的代码的修改，我使用Chrome 53和Windows 7在本地进行了测试.
Here's a modification of your code that I tested locally using Chrome 53 and Windows 7.
主要更改是:
- 保存到设备之前，您需要调用
requestQuota()来获取本地设备上的空间-请参阅这个问题为例； - 将
pdf.output()返回的字符串转换为FileWriter的Blob; - 删除不必要的对
LocalFileSystem的引用.
- Before saving to the device, you need to call
requestQuota()to get space on the local device - see the documentation and this question for an example; - Convert the string returned by
pdf.output()to aBlobfor theFileWriter; - Remove the unnecessary reference to
LocalFileSystem.
写入文件的位置取决于您的操作系统和浏览器；如果您使用的是Chrome，可以在以下位置找到更多信息:文件写在这里.
The location of the written file depends on your operating system and browser; if you're using Chrome, you can find more information about where the file was written here.
在Windows 7上，我在这里找到文件:C:\Users\USERNAME\AppData\Local\Google\Chrome\User Data\Default\File System\018\p\00\00000016
On Windows 7, I found the file here: C:\Users\USERNAME\AppData\Local\Google\Chrome\User Data\Default\File System\018\p\00\00000016
通过将.pdf附加到文件名，我可以在Adobe Reader中打开它.
I was able to open it in Adobe Reader by appending .pdf to the filename.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jsPDF</title>
<script src="jquery.min.js"></script>
<script src="jspdf.js"></script>
<script src="FileSaver.js"></script>
<script src="html2canvas.js"></script>
<script>
window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
function saveFile(){
var pdf = new jsPDF('p', 'pt', 'a4');
var source = $('#spendingTable')[0];
var PDFFILE ='';
var filename = prompt("Enter a file name:");
pdf.specialElementHandlers = {
'#bypassme': function (element, renderer) {
return true;
}
};
pdf.fromHTML(source, 15, 15, {'width': 170}, function (dispose) {
PDFFILE = new Blob([pdf.output()], {type: "application/pdf"});
});
//NEXT SAVE IT TO THE DEVICE
var requestedBytes = 1024*1024*10; // 10MB
navigator.webkitPersistentStorage.requestQuota (
requestedBytes, function (grantedBytes) {
window.requestFileSystem(PERSISTENT, 1024*1024, function (fileSystem) {
fileSystem.root.getFile(filename +".pdf", {create: true}, function (entry) {
var fileEntry = entry;
entry.createWriter(function(writer) {
writer.onwrite = function(evt) {
alert("Saved to root folder!");
};
writer.write(PDFFILE);
},
function (error) {
alert(error);
});
},
function (error) {
alert(error);
});
},
function (event) {
alert(event.target.error.code);
});
}
);
}
</script>
</head>
<body>
<h1>JSPDF EXAMPLE</h1>
<hr>
<div contenteditable="true" id="spendingTable" style="border: 1px black solid">This text is saved into a PDF.</div>
<br>
<input type="button" value="Save" onclick="saveFile();">
</body>
这篇关于尝试使用Intel XDK保存PDF文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
