Question

我对jquery很新，但我正在尝试执行以下操作：单击一个链接，replaceWith（）一个表单，然后单击表单中的提交，触发第二个jquery函数和一个ajax调用，另一个替换为replace（）。

这是两个功能

$(function addtop10fromuserpage() {
    $(".addshowtotop10").click(function () {
        var button = $(this);
        button.replaceWith('<form><input class="addtop10userinput" type="text" name="seriesname" /><input type="submit" class="button small addtop10usersubmit" value="Add" /></form>');
    });
});


$(function addtop10fromuserpageshowadd() {
    $(".addtop10usersubmit").click(function () {
        var button = $(this);

        var position = button.closest(".top-rating").find(".top-rating-text").html();
        alert('position');
    });
});

基本上，如果它们被单独调用，则两个函数都可以正常，但如果我从replacewith形式调用第二个函数，则它不起作用。那是为什么？

感谢。

Answer 1

由于元素是动态创建的，因此您需要使用基于事件委托的处理程序

$(function addtop10fromuserpage() {
    $(document).on('click', ".addshowtotop10", function () {
        var button = $(this);
        button.replaceWith('<form><input class="addtop10userinput" type="text" name="seriesname" /><input type="submit" class="button small addtop10usersubmit" value="Add" /></form>');
    });
});


$(function addtop10fromuserpageshowadd() {
    $(document).on('click', ".addtop10usersubmit", function () {
        var button = $(this);

        var position = button.closest(".top-rating").find(".top-rating-text").html();
        alert('position');
    });
});

replaceWith（）和第二个jQuery函数

1 个答案: