Question

我有以下表格

<form autocomplete="off" id="settleUp" name="settleUp" method="post" role="form">
    <div class="col-lg-5 col-md-5 col-sm-5 col-xs-12">
        <div class="form-group">
             <div class="input-group">
                  <h4>Gautam Sawala</h4>
             </div>
        </div>
    </div>
    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">
          <div class="form-group">
               <div class="input-group">
                    <span class="input-group-addon">
                          <i class="fa fa-eur"></i>
                    </span>
                    <input onChange="checkInput(this);" step="0.01" type="number" class="form-control" id="amount" name="amount" value="0.00" placeholder="0.00" min="0.00" required>
                    <input id="payeeId" name="payeeId" value="3" hidden required>
               </div>
          </div>
   </div>
   <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
         <div class="form-group">
              <div class="input-group">
                  <input type="submit" class="btn btn-success" value="Pay Back">
              </div>
   </div>
</div>

我想将此表单作为ajax表单提交，

$("#settleUp").submit(function(e){
        alert('here');
        $.ajax({
            type:"PUT",
            url: "/api/v1/settlements",
            data: $(this).serialize()+'&groupId='+'<?php echo $_GET['group_id'] ?>'+'&userId='+'<?php echo $_SESSION['userId'] ?>'+'&token='+'<?php echo $_SESSION['token'] ?>',
            dataType: "json",
            success: function(response){
                refreshExpenseListing();
                $('#settleUpModal').modal('hide');
                },
            error: function(data) {
                alert("failure");
              }
        });

        e.preventDefault();
    });

我可以使用id

形式的$("#settleUp").submit(function(e)提交表单

但我有多个表单，我想使用name而不是id提交表单。

AJAX中有没有办法做到这一点？

像这样的东西， $("form[formname]").submit(function(e)？

我试过了 $("form.settleUp").submit(function(e)但这不起作用！

Answer 1

是的，您可以使用 Attribute Equals Selector ：

来实现

$("form[name='settleUp']").submit(function(e){
    //Your code here
}

说明

首次尝试：

$("form[formname]").submit(function(e)
您的第一次尝试无效，因为您只提供值formname而未指定相关属性。

第二次尝试：

$("form[formname]").submit(function(e)
由于settleUp是一个类选择器，因此您的表单的类名等于.，因此无效。

要处理由ajax动态添加到文档中的表单，您必须使用事件委派 on() ：

$('body').on('submit', "form[name='settleUp']", function(e)

希望这有帮助。

Ajax：使用表单名称提交表单

1 个答案:

说明