2

カスタムコントロールを生成するためのコードをいくつか作成しました。コードはjQuery要素を返し、呼び出し元はこのjQuery要素をDOMに追加します。ジェネレーターコードのコントロールにカスタムスクロールバーを適用しましたが、要素がまだDOMに追加されていないため、適用されません。

私の質問：要素がDOMに追加されたときにカスタムスクロールバーを適用するために、onAppendイベントなどはありますか？

ジェネレーターのサンプルコード：

function getControl(controlParams){
    var $control = $('<div/>');
    $control.applyCustomScrollBar(); //Not appended to DOM yet, so doesnt work
    return $control;
}

消費者向けのサンプルコード：

var $control = getControl(controlParams);
$("body").append($control); //Appending to DOM now

次のようなことをしたい：

function getControl(controlParams){
    var $control = $('<div/>');
    $control.onAppend(function(){
        $(this).applyCustomScrollBar();
    });

    return $control;
}
4

2 に答える 2

6

要素がDOMに追加されているかどうかを検出するには、カスタムイベントをトリガーする必要があります。これを試してください。

$("body").on("appened", "div", function(event){
    //event after append the element into DOM, do anything
    $(this).css("background", "blue");
});

$("<div/>", {
    id: "some-control",
    text: 'Example Control'
}).appendTo("body").trigger("appened");​

フィドルの例： http： //jsfiddle.net/uudDj/1/

それが役に立てば幸い

于 2012-12-21T12:20:15.410 に答える
2

あなたはjqueryなしでそれを行うことができますMutationObserver

MutationObserver開発者にDOMの変更に対応する方法を提供します。これは、DOM3イベント仕様で定義されているミューテーションイベントの代わりとして設計されています。

// select the target node
var target = document.getElementById('some-id');

// create an observer instance
var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    console.log(mutation.type);
  });    
});

// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true };

// pass in the target node, as well as the observer options
observer.observe(target, config);

// later, you can stop observing
observer.disconnect();

ソース： このブログ投稿からそれを取ったdevdocs.io

于 2016-11-01T21:17:27.323 に答える