javascript - 如何选择表格中的所有输入字段

Question

我有一个“位于”表格内的表格

                <form id="form">
            <input type="submit" value="send" class="btn btn-w-m btn-primary" style="float: left;">Add transaction</input>
            <table class="table table-striped table-bordered table-hover " id="editable" >
                <thead>
                <tr>
                    <th>Date</th>
                    <th>Name<br>(Last name, Firstname,<br>
                        or Business name)
                    </th>
                    <th>Address</th>
                    <th>Phone</th>
                    <th>Price with VAT</th>
                    <th>VAT</th>
                    <th>Transaction type</th>
                    <th>Currency</th>
                    <th>Installments</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td><input type="date" name="date"/></td>
                    <td><input type="text" name="name"/></td>
                    <td><input type="text" name="address"/></td>
                    <td><input type="text" name="phone"/></td>
                    <td><input type="text" name="price_with_vat"/></td>
                    <td>25%(from database)</td>
                    <td class="exclude"><select name="transaction_type">
                            <option>value1</option>
                            <option>value2</option>
                            <option>value3</option>
                        </select></td>
                    <td class="exclude"><select name="currency">
                            <option>Euro</option>
                            <option>USD</option>
                            <option>Pound</option>
                        </select></td>
                    <td class="exclude"><select name="installments">
                            <option>Yes</option>
                            <option>No</option>
                        </select></td>
                </tr>
                </tbody>

我想要的是选择所有输入值并向 php 端发送 Ajax 请求。问题是在我的 jquery 函数(以下代码)中我无法收集所有输入。另外，尽管我有一个 preventDefault 页面仍然会刷新。

    var request;
$('#form').submit(function(event){

    if (request){
        request.abort();
    }

    var form = $(this)

    var $inputs = $form.find("input, select, button, textarea");
    var serializedData = $form.serialize();
    $inputs.prop("disabled", true);
    console.log(serializedData);
    event.preventDefault();
});

Answer 1

试试这段代码

For a form element's value to be included in the serialized string, the element must have a name attribute.

$(document).ready(function() {
  //Form submit event
  $('#form').on('submit', function(e){

    // validation code here
    if(!valid) {
      e.preventDefault();
    }

    //Serialized data 
    var datastring = $("#form").serialize();

    //Ajax request to send data to server
    $.ajax({
        type: "POST",
        url: "your url.php",
        data: datastring,
        success: function(data) {
            alert('Data send');
        }
    });
  });
});