web-dev-qa-db-ja.com

HTML埋め込みPDFとオンロード

次のhtmlのWebページにPDF)を埋め込んでいます:-

<object id="pdf" classid="clsid:CA8A9780-280D-11CF-A24D-444553540000" width="1024" height="600">
    <param name="SRC" value="/GetDoc.ashx?SOID=<%=Html.Encode(Model.OrderID)%>" />
    <embed src="/GetDoc.ashx?SOID=<%=Html.Encode(Model.OrderID)%>" width="1024" height="600">
        <noembed> Your browser does not support embedded PDF files. </noembed>                     
    </embed>
</object>

PDFの読み込みが少し遅くなる可能性があるため、オブジェクトを非表示にして、ユーザーが空白の画面を見ないように、完全に読み込まれるまで読み込みメッセージ/ gifを表示したいと思います。

私が本当に必要としているのは、オブジェクトが完全にロードされたことを知らせる方法だけです。の「onload」イベントを試しましたが、起動されないようです。

私はそれが不可能かもしれないと思い始めています、しかしそれは尋ねることを決して傷つけません...

27
phil_h

なぜみんながそんなに難しくするのか分かりません。

<object data="yourfile.pdf" style="background: transparent url(AnimatedLoading.gif) no-repeat center;" type="application/pdf" />
13
DougB

次のコードが機能します。

<div style="background: transparent url(loading.gif) no-repeat">
<object height="1250px" width="100%" type="application/pdf" data="aaa.pdf">
<param value="aaa.pdf" name="src"/>
<param value="transparent" name="wmode"/>
</object>
</div>
10
user124118

PDF with jQuery ajaxをブラウザキャッシュにロードしています。次に、すでにブラウザキャッシュにあるデータを使用して埋め込み要素を作成します。


var url = "http://example.com/my.pdf";
// show spinner
$.mobile.showPageLoadingMsg('b', note, false);
$.ajax({
    url: url,
    cache: true,
    mimeType: 'application/pdf',
    success: function () {
        // display cached data
        $(scroller).append('<embed type="application/pdf" src="' + url + '" />');
        // hide spinner
        $.mobile.hidePageLoadingMsg();
    }
});

Httpヘッダーも正しく設定する必要があります。


HttpContext.Response.Expires = 1;
HttpContext.Response.Cache.SetNoServerCaching();
HttpContext.Response.Cache.SetAllowResponseInBrowserHistory(false);
HttpContext.Response.CacheControl = "Private";
7
Pavel Savara

PDFコンテンツが読み込まれる前にDOMが読み込まれるため、推奨事項はいずれも有効ではありません。したがって、DOMはActiveXコンテンツを制御できません。

3
Michael
$(document).ready(function() {
   });

これは主にdocument.readyState == interactiveではなくdocument.readyState == completeで発生するため、機能しません。

このチェック(document.readyState == "complete")でタイマーを設定すると、間違いなく機能します。

1
Amir Shahzad
<embed onload='alert("I should be called")'></embed>
0
jmjm

「タグ内のコンテンツは、オブジェクトの読み込み中に表示されますが、まだ完了していません。」

だからあなたのスピナーをそこに置いてください、そしてそれはあなたのためにうまくいくはずです。また、JavaScriptを作成する必要はありません。

src: http://en.wikibooks.org/wiki/XHTML/XHTML_Objects

0
geowa4

JQueryのdocument.ready()関数のようなものが必要になります。 IE以外のブラウザーの場合は、イベントDOMContentLoadedのハンドラーを登録できます。ハンドラー関数は、すべての画像とオブジェクトが読み込まれた後に呼び出されます。 IEの場合、document.readyStateプロパティを継続的にチェックし、"complete"になるのを待つ必要があります。

JQueryを使用している場合、彼らはあなたのために大変な仕事をしてくれたので、あなたがしなければならないのは:

$(document).ready(function() {
    //take away the "loading" message here
});

Jqueryを使用したくない場合は、次のような操作を行う必要があります。

addEventListener('DOMContentLoaded', function() { 
    //take away the "loading" message here
});

function waitForIE() {

    if (!document.all) return;

    if (document.readyState == "complete") {
        //take away the "loading" message here
    }
    else {
        setTimeout(waitForIE, 10);
    }
}

waitForIE();
0
Matt Bridges