jquery - ページを含むAjax

Question

Ajaxからロードされたページでいくつかの関数を作成できますか？IE

$(function() {
    $.ajax({
        url: "loaded.php",
        success: function(data) {
            $("#content").html(data);
        }
    });
    $("a#edit").click(function(e) {
        e.preventDefault();
        var newVal = $(this).closest("tr").find("#collapse").html();
        $(this).html(newVal);
    });
});

a#editとは両方とも#collapseloaded.phpの要素であり、このコードはindex.phpページにあります...このコードは機能しますか？

Answer 1

#contenthtmlを追加するか、委任を使用した後、success関数にハンドラーをアタッチする2つのオプションがあります。

オプション1

    success: function(data) {
        $("#content").html(data);
        $("#edit").click(function(e) {
            e.preventDefault();
           var newVal = $(this).closest("tr").find("#collapse").html();
           $(this).html(newVal);
        });
    }

オプション2

$(function() {
    $.ajax({
        url: "loaded.php",
        success: function(data) {
            $("#content").html(data);
        }
    });
    $("#content").on('click', '#edit', function(e) {
        e.preventDefault();
        var newVal = $(this).closest("tr").find("#collapse").html();
        $(this).html(newVal);
    });
});

http://api.jquery.com/on/

Answer 2

$（ "a＃edit"）要素がajaxによって返されるものである場合、このコードは機能しません。そのコードブロックを成功コールバックに移動する必要があります。

$(function() {
    $.ajax({
        url: "loaded.php",
        success: function(data) {
            $("#content").html(data);
            $("a#edit").click(function(e) {
                e.preventDefault();
                var newVal = $(this).closest("tr").find("#collapse").html();
                $(this).html(newVal);
            });
        }
    });
});