windows 8 javascript应用程序打印片段不打印a中的图片<;部门>;
我有这个问题:(我会附上下面的代码)我有一个分屏模板Windows8应用程序。在屏幕的右侧,我有一个食谱,上面有一张图片。下半部分有描述。这两个部分位于同一块中。图片和文本显示在data.js文件中的数组中。例如,从var背景显示图片:“images\recipes\picture1.jpg”,从var描述显示描述:“示例文本bla bla bla”。我创建了一个文档片段,将其克隆并发送打印。除了这张照片,所有的东西都印对了。我得到了一个X图标而不是图片。现在,我将编写用于此目的的所有代码。我不知道怎么了。在我遵循的一个例子中,一切都是正确的。好了,我的不行windows 8 javascript应用程序打印片段不打印a中的图片<;部门>;,javascript,printing,windows-store-apps,Javascript,Printing,Windows Store Apps,我有这个问题:(我会附上下面的代码)我有一个分屏模板Windows8应用程序。在屏幕的右侧,我有一个食谱,上面有一张图片。下半部分有描述。这两个部分位于同一块中。图片和文本显示在data.js文件中的数组中。例如,从var背景显示图片:“images\recipes\picture1.jpg”,从var描述显示描述:“示例文本bla bla bla”。我创建了一个文档片段,将其克隆并发送打印。除了这张照片,所有的东西都印对了。我得到了一个X图标而不是图片。现在,我将编写用于此目的的所有代码。我不
</header>
<img class="article-image" src="#" data-win-bind="src: backgroundImage; alt: title" style="border: 10px double #73513B;" />
<div class="article-content" data-win-bind="innerHTML: content"> </div>
</article>
</div>
就绪功能加载项:
document.getElementById("Print").addEventListener("click", PrintButtonHandler, false);
// Register for Print Contract
registerForPrintContract();
</header>
<img class="article-image" src="#" data-win-bind="src: backgroundImage; alt: title" style="border: 10px double #73513B;" />
<div class="article-content" data-win-bind="innerHTML: content"> </div>
</article>
</div>
有关打印的所有代码:
function registerForPrintContract() {
var printManager = Windows.Graphics.Printing.PrintManager.getForCurrentView();
printManager.onprinttaskrequested = onPrintTaskRequested;
WinJS.log && WinJS.log("Print Contract registered. Use Print button to print.", "sample", "status");
}
/// <summary>
/// Print event handler for printing via the PrintManager API. The user has to manually invoke
/// the print charm after this function is executed.
/// </summary>
/// <param name="printEvent" type="Windows.Graphics.Printing.PrintTaskRequest">
/// The event containing the print task request object.
/// </param>
function onPrintTaskRequested(printEvent) {
var printTask = printEvent.request.createPrintTask("Print part", function (args) {
var frag = document.createDocumentFragment();
frag.appendChild(document.getElementById("print").cloneNode(true));
args.setSource(MSApp.getHtmlPrintDocumentSource(frag));
// Register the handler for print task completion event
printTask.oncompleted = onPrintTaskCompleted;
});
}
/// <summary>
/// Print Task event handler is invoked when the print job is completed.
/// </summary>
/// <param name="printTaskCompletionEvent" type="Windows.Graphics.Printing.PrintTaskCompleted">
/// The event containing the print task completion object.
/// </param>
function onPrintTaskCompleted(printTaskCompletionEvent) {
// Notify the user about the failure
if (printTaskCompletionEvent.completion === Windows.Graphics.Printing.PrintTaskCompletion.failed) {
WinJS.log && WinJS.log("Failed to print.", "sample", "error");
}
}
function PrintButtonHandler() {
// Optionally, functions to be executed immediately before and after printing can be configured as following:
window.document.body.onbeforeprint = beforePrint;
window.document.body.onafterprint = afterPrint;
// If the print contract is registered, the print experience is invoked.
Windows.Graphics.Printing.PrintManager.showPrintUIAsync();
}
var page = WinJS.UI.Pages.define("/page/split.html", {
ready: function (element, options) {
var dataTransferManager = Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView();
dataTransferManager.addEventListener("datarequested", dataRequested);
document.getElementById("share").addEventListener("click", showShareUI, false);
},
unload: function () {
var dataTransferManager = Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView();
dataTransferManager.removeEventListener("datarequested", dataRequested);
}
});
function dataRequested(e) {
var request = e.request;
// Title is required
var dataPackageTitle = document.getElementById("titluReteta").value;
if ((typeof dataPackageTitle === "string") && (dataPackageTitle !== "")) {
var range = document.createRange();
range.selectNode(document.getElementById("print"));
request.data = MSApp.createDataPackage(range);
request.data.properties.title = dataPackageTitle;
// The HTML fragment we are using has an image tag that references a local file accessible only to this application.
// To make sure that target application can render this image, we need to populate a resourceMap as part of the share operation data
// We use the image's relative src property as the key to the resourceMap item we're adding
var path = document.getElementById("print").getAttribute("src");
var imageUri = new Windows.Foundation.Uri(path);
var streamReference = Windows.Storage.Streams.RandomAccessStreamReference.createFromUri(imageUri);
request.data.resourceMap[path] = streamReference;
} else {
request.failWithDisplayText(SdkSample.missingTitleError);
}
}
function showShareUI() {
Windows.ApplicationModel.DataTransfer.DataTransferManager.showShareUI();
}
})();
</header>
<img class="article-image" src="#" data-win-bind="src: backgroundImage; alt: title" style="border: 10px double #73513B;" />
<div class="article-content" data-win-bind="innerHTML: content"> </div>
</article>
</div>
如果有人能解决这个问题,我真的需要一个快速的答案。我需要这个项目被发送到星期五。在我尝试了很多的例子之后,我变得不知所措。非常感谢能救我的人
</header>
<img class="article-image" src="#" data-win-bind="src: backgroundImage; alt: title" style="border: 10px double #73513B;" />
<div class="article-content" data-win-bind="innerHTML: content"> </div>
</article>
</div>
乐:我还尝试了一部经典的描述字段。图片出现在应用程序中,但打印结果相同:一个大X图标而不是图片。解决方法是使用重新格式化的CSS代码打印整个文档,以显示我想要显示的内容。现在它可以毫无问题地捕获所有图片。对于仅捕获图片的初始问题,没有得到任何答案
</header>
<img class="article-image" src="#" data-win-bind="src: backgroundImage; alt: title" style="border: 10px double #73513B;" />
<div class="article-content" data-win-bind="innerHTML: content"> </div>
</article>
</div>