Javascript 动态地将表单ID传递给函数

我在一个页面上有几个表单，我想使用相同的ajax功能。它对于一个表单非常有效，因为我用

getElementById

获取id，然后将其传递给我的ajax函数。我试图做的是动态地传递表单的id

表格

<form id="postData" name="business" method="post" action="{{ path('location_graph', {'location_id': location.getId }) }}"
      class="m-form m-form--fit m-form--label-align-right">
    <div class="form-group m-form__group row">
        <label class="col-2 col-form-label required" for="description">Business
            Description</label>
        <div class="col-7">
            <input type="text" class="form-control m-input" id="description"
                   name="extra[description]">
        </div>
    </div>

    ...

    <div class="form-group m-form__group row">
        <button type="submit" class="btn m-btn--square btn-outline-primary">
            Submit
        </button>
    </div>
</form>

---

您可以将

submit

事件处理程序附加到每个表单，并将

event

和

this.id

（表单元素的

id

）作为参数传递

Javascript:

function postData(event, id) {
    event.preventDefault();
    var elem = $('#'+id);
    $.ajax({
        type: elem.attr("method"),
        url: elem.attr("action"),
        data: elem.serialize(),
        success: function (data) {
            console.log(data);
            $('#success__para').html("You data was saved");
        }
    });
}

HTML:

---

在表单

数据表单id=“form1”

中添加一个属性，然后在javascript

var formId=$（this.data（'form-id'）中添加一个属性
function postData(event, id) {
    event.preventDefault();
    var elem = $('#'+id);
    $.ajax({
        type: elem.attr("method"),
        url: elem.attr("action"),
        data: elem.serialize(),
        success: function (data) {
            console.log(data);
            $('#success__para').html("You data was saved");
        }
    });
}

<form id="someid" onsubmit="postData(event, this.id)">