append.html jquery не работает так же, как существующий HTML?

Question

У меня есть ситуация, когда я добавляю html для загрузки большего количества постов (разбиение на страницы), и у каждого поста есть ссылка для ответа, прикрепленный html не работает должным образом:

пост jquery:

$(function () {
    //More Button
    $('.more').live("click", function () {
        var ID = $(this).attr("id");
        if (ID) {
            $("#more" + ID).html('<img src="moreajax.gif" />');

            $.ajax({
                type: "POST",
                url: "ajax_more.php",
                data: "lastmsg=" + ID,
                cache: false,
                success: function (html) {
                    $("ul.statuses").append(html);
                    $("#more" + ID).remove();
                }
            });
        } else {
            $(".morebox").html('The End');
        }

        return false;

    });
});

html файл:

return <<<ENDOFRETURN
    <li>
        <a href="nano.com/$username"><img class="avatar" src="images/$picture" width="48" height="48" alt="avatar" /></a>
        <div class="tweetTxt">
            <strong><a href="nano.com/$username">$username</a></strong> $auto
            <div class="date">$rel</div>
            <a class ="reply" href="home.php?replyto=@$username&status_id=$id&reply_name=$username"> reply </a>
        </div>
        <div class="clear"></div>
    </li>
ENDOFRETURN;

ссылка для ответа jquery:

function insertParamIntoField(anchor, param, field) {
    var query = anchor.search.substring(1, anchor.search.length).split('&');

    for (var i = 0, kv; i < query.length; i++) {
        kv = query[i].split('=', 2);
        if (kv[0] == param) {
            field.val(kv[1]);
            return;
        }
    }
}

$(function () {
    $("a.reply").click(function (e) {

        insertParamIntoField(this, "status_id", $("#status_id"));
        insertParamIntoField(this, "reply_name", $("#reply_name"));
        insertParamIntoField(this, "replyto", $("#inputField"));

        $("#inputField").focus()
        $("#inputField").val($("#inputField").val() + ' ');

        e.preventDefault();
        return false; // prevent default action
    });
});

Answer 1

Измените свой обработчик click на .live(), чтобы он работал и для ссылок, добавленных позже .:

$(function () {
  $("a.reply").live("click", function (e) {
     insertParamIntoField(this, "status_id", $("#status_id"));
     insertParamIntoField(this, "reply_name", $("#reply_name"));
     insertParamIntoField(this, "replyto", $("#inputField"));
     $("#inputField").val(function(i, v) { return v + ' '; }).focus();
     return false;
  });
});

Answer 2

Я делаю снимок в темноте, но, похоже, вы не использовали событие .live() на кнопках ответа. Любые новые кнопки, добавляемые к документу, не будут иметь события щелчка, указанного вами для них.

Короче говоря, убедитесь, что все кнопки, которые загружаются динамически и должны запускать событие, используют «живое» связывание событий.