0

documnet.getElement(xxx).innerHTML = myGeneratedHTML に書き込む短いスクリプトがあります。

生成された HTML にスタイリングを記述するための jquery コードもあります。問題は、ドキュメントに HTML を書き込んだ後に jquery メソッドを実行する必要があることです。

コールバックを行う必要がありますが、私が見たコールバックはファイルと URL からデータを抽出するためのものでした。html がドキュメントへの書き込みを完了するまで待機するコールバックはありますか?

4

3 に答える 3

2

間隔を使用して、要素の HTML が HTML と一致するかどうかを確認できます。

var intervalCounter = setInterval(function() {
  if(documnet.getElement(xxx).innerHTML == myGeneratedHTML) {
    alert("HTML Loaded");
    clearInterval(intervalCounter);
    intervalCounter = null;
  }
}, 10);

documnet.getElement(xxx).innerHTML = myGeneratedHTML;
于 2013-05-24T09:09:57.573 に答える
2

そのようなコールバックはないと思います.DOMに要素を書き込んだ後、すぐにアクセスできるはずです.HTMLを更新する関数を実行した後、スタイリングなどを更新するだけです.

さらに良いことに、すべての構文を jQuery で保持します。ライブラリを既に使用しているので、自分の生活を楽にして、必要なことを行うためにその関数を使用してみませんか? したがって、jQuery を使用して HTML を更新し、jQuery を使用してスタイリングをこの順序で更新すると、問題は見つからないはずです。

すなわち -

$('#wantedElement').html("This is some html");
$('#wantedElement').css("color", "red");

html 内で新しく生成された要素のスタイルを設定したいですか? いくつかのサンプル コードを提供できますか (つまり、 内の html は何myGeneratedHTMLですか)。次に、次のようにします。

$('#wantedElement').html("<div class='anotherElement'>This is some html</div>");
$('#wantedElement .anotherElement').css("color", "red");

jQueryを使用している場合は、実際に書き込まれるのを待つ必要はありません。ループを設定したりsetInterval、これを確認するために使用したりする必要はありません。

JSON コールバックからの HTML へのスタイリングの追加に関するコメントの質問に追加します。

したがって、これを置き換えます：

documnet.getElement(xxx).innerHTML = myGeneratedHTML

これとともに：

$('#someElement').html(connHTML);

上記の直後にスタイリングを開始できるため、上記を完全に次のように置き換える必要があります。

//add the generated html from JSON call - where 'connHTML'
//is a variable containing the generated HTML from the JSON
//call and it contains a table

$('#someElement').html(connHTML);

//now style the content
$('#someElement table').css("width","100%");
$('#someElement table').css("background-color","red");
$('#someElement table').css("color","white");

上記のコードは単純化できますが、読みやすくするためにこのように記述されています ;)

于 2013-05-24T09:07:15.927 に答える
1

私はこれと同じ問題を抱えていたので、先に進んでそのためのプラグインを書きました。

$(selector).waitExists(function);

そしてコード：

(function ($) {

$.fn.waitExists    = function (handler, shouldRunHandlerOnce, isChild) {
    var found       = 'found';
    var $this       = $(this.selector);
    var $elements   = $this.not(function () { return $(this).data(found); }).each(handler).data(found, true);

    if (!isChild)
    {
        (window.waitExists_Intervals = window.waitExists_Intervals || {})[this.selector] =
            window.setInterval(function () { $this.waitExists(handler, shouldRunHandlerOnce, true); }, 500)
        ;
    }
    else if (shouldRunHandlerOnce && $elements.length)
    {
        window.clearInterval(window.waitExists_Intervals[this.selector]);
    }

    return $this;
}

}(jQuery));
于 2013-05-24T09:17:33.763 に答える