1

私は次のようなJQueryMobile開発に非常に標準的な「1ページ」モデルを使用しています。

<div id="page1" data-role="page">Lorem Ipsum</div>
<div id="page2" data-role="page">
    <div id="mycontent" data-role="content"></div>
</div>

リンクをクリックしてpage1からpage2に移動すると、幅/高さが常に指定されていない画像を含むコンテンツが$（ "＃mycontent"）に追加され、iScroll-4が適用されます。コンテンツをスクロール/ズームする-場合によっては、ロードされたらすぐにズームして、モバイル画面にうまく収まるようにする必要があります（通常、開始時に幅600ピクセル）。問題は、画像が読み込まれると、特に要素を再配置する必要があるため、フォーマットが崩れることです。CSSズームは、ズームされたアイテムを中央に配置するのが好きで、左上隅に揃えられないためです。

これはおそらく単純な問題の長い説明でした（おそらく上記を行うためのより良い方法がありますか？）が、これが私の本当の問題です：divのloadイベントのイベントリスナーを追加しようとしているので、すべての画像が読み込まれたら、divの位置を変更する必要があるかどうかを確認できます。

$("#mycontent").addEventListener('load', doSomething(), false);

function doSomething(){  alert("something");  }

クレイジーなことは、doSomething（）が起動されますが、Safariは次のエラーをスローし、JQueryをクラッシュさせます。

TypeError：'undefined'は関数ではありません（'$（ "＃mycontent"）。addEventListener（' load'、doSomething（）、false）'を評価しています）

この要素はDOMに存在し、イベントリスナーが追加されたときに確実に読み込まれます。これは、要素が起動するという事実によって明らかになっていると思います。JQMは、要素が遷移するときにいくつかのスタイルを要素に適用しますが、それが要素にどのように影響するかはわかりません。

私はしばらくの間これに頭をぶつけていて、サイズの変更をチェックするためにいくつかの非常に醜いループハックを書き込もうとしているので、どんな助けもいただければ幸いです：/

4

2 に答える 2

0

2つの考えられる問題があります。addEventListenerの2番目のパラメーターは、関数呼び出しではなく、関数である必要がありますelement.addEventListener("load", doSomething, false);。コードでdoSomething()は、イベント名が何であれ、が実行されます。

また、$('#mycontent')TypeErrorの原因と思われる要素の配列を返すため、次を使用することをお勧めします。

var mycontent = document.getElementById('mycontent');
mycontent.addEventListener("load", doSomething, false);

JQueryにはload（）もあり、各画像のloadイベントをリッスンしてレイアウトを調整すると、機能する可能性があります。

$('#mycontent img').load(doSomething);

これは画像ごとに1回発生するため、画像の数がわかっている場合はカウントを維持するか、ロードごとにタイムアウトを作成/リセットし、タイムアウト後にdoSomethingを呼び出します。

于 2012-03-12T08:24:43.563 に答える
0

エラーが発生する理由は、JQueryを使用していて、JQueryAPIをバイパスしてイベントを追加しようとしているためです。addEventListenerメソッドを使用しないでください。$('#mycontent').load(handler)代わりに、handlerが引数を受け入れる関数である場合に使用します。例えば$('#mycontent').load(function (e) {alert ("loaded")})

于 2012-03-29T18:00:43.777 に答える