Javascript 执行表单提交调用函数，而不是在其id上创建特定的提交

我在一个项目中使用了许多表单，在页面（由php生成）的一部分使用“”为每个表单id添加了特定的函数，这些表单正在工作，例如：

$("#fregistrazione").submit(function(event){
...
}

<form id="f_man-marker_edit-marker" method="post" action="#" onsubmit="TM.editMarker(this)">
...

...
TM.editMarker = function(rform){

    // Abort any pending request
    if (request) { request.abort(); }

    let form = $(rform);

    // Let's select and cache all the fields
    let inputs = form.find("input, select, button, textarea");

    // Serialize the data in the form
    let serializedData = form.serialize();

    // Let's disable the inputs for the duration of the Ajax request.
    // Note: we disable elements AFTER the form data has been serialized.
    // Disabled form elements will not be serialized.
    inputs.prop("disabled", true);

    request = $.ajax({
        url: "ajax.php?req=man-marker_edit-marker",
        type: "post",
        data: serializedData,
        dataType: "html"
    });

    request.done(function (response){
        $("#ajaxoutput2").empty().append(response);
        $("#ResultModal2").modal("show");
    });

    request.fail(function (jqXHR, textStatus, errorThrown){
        console.error(
            "Ajax man-marker_edit-marker request failed. The following error occurred: "+
            textStatus, errorThrown
        );
    });

    request.always(function () {
        inputs.prop("disabled", false);
    });

};

我对一个加载了ajax请求的html部分也做了同样的操作，但它不起作用。 我想用一种不同的方式来处理由多个表单提交调用的相同函数，而不是为任何表单提交上的任何表单定义一个不同的函数，使用附加参数调用一个函数，以较少的代码重复来处理特定的表单，但我无法让它工作。 我做了很多尝试，例如：

$("#fregistrazione").submit(function(event){
...
}

<form id="f_man-marker_edit-marker" method="post" action="#" onsubmit="TM.editMarker(this)">
...

...
TM.editMarker = function(rform){

    // Abort any pending request
    if (request) { request.abort(); }

    let form = $(rform);

    // Let's select and cache all the fields
    let inputs = form.find("input, select, button, textarea");

    // Serialize the data in the form
    let serializedData = form.serialize();

    // Let's disable the inputs for the duration of the Ajax request.
    // Note: we disable elements AFTER the form data has been serialized.
    // Disabled form elements will not be serialized.
    inputs.prop("disabled", true);

    request = $.ajax({
        url: "ajax.php?req=man-marker_edit-marker",
        type: "post",
        data: serializedData,
        dataType: "html"
    });

    request.done(function (response){
        $("#ajaxoutput2").empty().append(response);
        $("#ResultModal2").modal("show");
    });

    request.fail(function (jqXHR, textStatus, errorThrown){
        console.error(
            "Ajax man-marker_edit-marker request failed. The following error occurred: "+
            textStatus, errorThrown
        );
    });

    request.always(function () {
        inputs.prop("disabled", false);
    });

};

我尝试过（即使IDE给了我不推荐的事件）：

也没有，但在这两种情况下都不起作用

编辑2： 解决方法：

$('#f_man-marker_edit-marker').on('submit', function(e){
    TM.editMarker(e, $(this), 'man-marker_edit-marker');
});

...

TM.editMarker = function (e, form, ajax_request) {
...

但我愿意接受更好的解决方案。

简单回答：

您操纵了DOM，因此事件绑定中还没有选择器。 使用已经存在的父选择器，如

document

$(document).on("submit", "#fregistrazione", function(event){
   event.preventDefault(); // stop the form submitting if needed
...
});

---

这样它就可以正常工作了

下面是正确的方法：@ChrisG谢谢你的回复，我试过了，但没有解决，firefox控制台也没有显示jserror@ChrisG我重试后发现问题是

$（（）=>{}

需要避免页面加载上的脚本出现一些问题，而这些问题是在从ajax请求中删除html后收到的脚本上产生的。

$（'f#f#man-marker_edit-marker'）。在（'submit'，TM.editMarker）；

正在为您的回复工作，我尝试了它，但没有解决表单问题（以及从ajax收到的脚本）提交不工作与上面我重试过的相同，问题是

$（（）=>{}

正在工作，但是上面的ChrisG解决方案更好，我还在搜索更好的东西（如果存在）