1

jquery でいくつかの html を DOM に追加し、いくつかのイベントを生成された要素にバインドする必要がありますが、同期できません。addEvents 関数が開始する場所では、DOM 要素が作成されないため、$(".login-log" ) 要素はまだ DOM 上にありません。

私はこれを見つけました：

Javascript イベントの同期

私はそれに取り組んでいますが、私のコードではうまくいきません。

var Login = function ()
{
var commons = new Commons();

this.init = function()
{
    stepOne(stepTwo);

    commons.init();
}

function stepOne(callback) {
    var AsyncDone = function()
    {
        callback();
    }
    loadFiles(AsyncDone);
}

function loadFiles(callback)
{
    $(".header-container").load("views/header.html");
    $(".content-container").load("views/login.html");
    callback();
}

function stepTwo() {
    addEvents();
}

function addEvents() {
    alert("is here");
    $(".login-log").bind("click", function() { alert("fuck"); });
}
}

syncronizathion により、header と login.html の DOM 要素が DOM にロードされる前に、「is here」というアラートが表示されます。

シンプルでなければならないことはわかっていますが、解決策が見つかりません。

アドバイスありがとう。

4

1 に答える 1

1

私の最終的な選択：

this.init = function()
{
    loadHeader(addHeaderEvents);
    loadTemplate(addTemplateEvents);
    loadFooter(addFooterEvents);

    commons.init();

}

function loadHeader(callback) {
    $(".header-container").load("views/header.html", function() {
        callback();
    });
}
function addHeaderEvents() {

}

function loadTemplate(callback) {
    $(".content-container").load("views/template_login.html", function() {
        callback();
    });
}
function addTemplateEvents() {
    alert("llega");
    $(".login-log").bind("click", function() { alert("done"); });
}

function loadFooter(callback) {
    $(".footer-container").load("views/footer.html", function() {
        callback();
    });
}
function addFooterEvents() {

}
于 2013-02-18T08:02:17.393 に答える