javascript - 如何在 on() 方法内调用 ajax 后执行 javascript

Question

我正在尝试在 .on() 方法调用的函数内执行 $.ajax() ，以便在新附加的数据中，可以在 .click() 事件上执行脚本 -我知道这可能与其他请求类似，但我已经尝试过，但找不到代码有什么问题......

ajax 函数通过 select 中的更改来调用，并且“this”作为变量传递给该函数。

数据已正确插入目标 div 内，但似乎没有冒泡，因为没有 javascript 从其中运行(但在目标 div 外部运行)。

我使用了 .on() 所以它会冒泡，并更新 DOM，我不知道我做错了什么......

ajax 的调用方式为:

$("body").on("change", "[data-project-ajaxSelect='true']", {select: this},Select_AjaxCall);

function Select_AjaxCall(event) {

    $select = event.data.select;

    if (typeof $select.data === "undefined" || $select.data === null) {
        var $select = $(this);
    }



    var options = {
        url: $select.attr("data-project-action"),
        type: $select.attr("data-project-method"),
        target: $select.attr("data-target"),
        data: { guid: $select.val() }
    }

    $.ajax({
        type: options.type,
        url: options.url,
        data: options.data,
        dataType: "html",
        success: function (data) {
            console.log(data)

            $(options.target).html(data);

        }
    });

    return false;

};

从该代码中，添加了一个带有以下 View 代码的按钮:

<button id=@Model.Guid
    class="button default cycle-button"
    data-toggle="modal"
    data-target="#modalDiv"
    data-backdrop="static"
    data-keyboard="true"
    data-modal-modal="true"
    data-modal-controller="Fin_Movement_Type"
    data-modal-action="Create"
    data-modal-var-guid=@Model.Guid
    data-modal-var-modal=@ViewBag._modal>
    <span class="icon mif-plus"></span>
</button>

通过单击此按钮，应触发以下 .click() 事件...

$("[data-modal-modal='true']").click(function () {  ...  }

但事实并非如此。

请帮我找出我的代码中的错误在哪里...谢谢。

Answer 1

编辑

看来您需要已从 jQuery 中删除的 live 功能，但您可以使用 on 来代替它，这样:

$(function () {
    $(document).on("click","[data-modal-modal='true']", function () {
        alert('clicked'); 
    });
});

原创

您可以在成功方法的末尾添加代码:

success: function (data) {
     console.log(data);
     $(options.target).html(data);
     $("[data-modal-modal='true']").on("click", function() {
         alert('clicked!');
     });
}

您还可以在 onclick 属性中使用合适的脚本加载按钮，例如:

<button id="@Model.Guid"
    ...
    onclick="alert('clicked!');">
    <span class="icon mif-plus"></span>
</button>