Javascript serialize（）返回空值

我试图帮助别人，但这让我发疯了

场景：一个巨大的javascript文件（14000行），底部有以下两个函数：

function addRoom() {
var roomNumber = document.getElementById("roomNumbers").selectedIndex; //check how many rooms to add
$('#roomGuestForm').html('');//clear div
for (i = 0; i < roomNumber; i++) //loop and add new guest details
{
    var roomDiv = document.createElement('div');
    var roomGuestForm = "<div class='child-guest-select'><label>Guests </label><ul class='small-block-grid-2'><li><i class='fa fa-male'></i><span><input type='text' data-dropdown='adult-guests' aria-controls='adult-guests' aria-expanded='false' value='2' readonly><ul id='adult-guests' class='f-dropdown' data-dropdown-content aria-hidden='true' tabindex='-1'><li><a href='#' title='0'>0</a></li><li><a href='#' title='1'>1</a></li><li><a href='#' title='2'>2</a></li><li><a href='#' title='3'>3</a></li><li><a href='#' title='4'>4</a></li><li><a href='#' title='5'>5</a></li><li><a href='#' title='6'>6</a></li><li><a href='#' title='7'>7</a></li><li><a href='#' title='8'>8</a></li><li><a href='#' title='9'>9</a></li></ul></span><small>18+ Years</small></li><li><i class='fa fa-child'></i><select id='childNumber" + i + "' onchange='addChild("  + i + ")'><option value='none'>0</option><option value='child-num-1'>1</option><option value='child-num-2'>2</option><option value='child-num-3'>3</option><option value='child-num-4'>4</option><option value='child-num-5'>5</option><option value='child-num-6'>6</option></select><small>Under 18</small></li></ul></label><div id='child" + i +"'></div></div>";
    roomDiv.id = 'room' + i;
    $('#roomGuestForm').append(roomDiv);
    $('#room' + i).append(roomGuestForm);
}};

表格如下：

<div class="content active" id="book1">
  <form class="filter"  id="bookingform" method="post">
    <div class="row">
      <div class="small-12 columns">
        <h5>Refine Your Dates</h5>
      </div>
    </div>
    <div class="row">
      <div class="small-12 medium-5 large-2 columns">
        <label>
          Check In Date
          <input type="text" class="date-input" id="checkin-date-picker" >
          <small class="parsed-date"></small>
          <small class="error">Please enter a date DD/MM/YYYY</small>
        </label>
      </div>
      <div class="small-12 medium-5 large-2 columns">
        <label>
          Check Out Date
          <input type="text" class="date-input" id="checkout-date-picker" >
          <small class="parsed-date"></small>
          <small class="error">Please enter a date DD/MM/YYYY</small>
        </label>
      </div>
      <div class="small-12 medium-5 large-2 columns">
        <label>
          Rooms
          <select id="roomNumbers" onchange="addRoom()">
            <option value="0" selected="selected">Select</option>
            <option value="1" >1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
          </select>
        </label>
      </div>

      <div id="roomGuestForm" class="small-12 medium-5 large-4 columns child-guest-select" ng-controller="ExampleController"></div>
      <div class="small-12 medium-5 large-2 columns">
        <button type="submit" class="hunt-button" id="roomformbutton">Hunt <i class="fa fa-angle-right"></i></button>
      </div>
</div>


  </form>

改进你的约会
登记日期
请输入日期DD/MM/YYYY
退房日期
请输入日期DD/MM/YYYY
房间
挑选
1.
2.
3.
4.
5.
6.
7.
8.
狩猎

问题是，当我在firebug中查看控制台时，得到的只是“[]”

空数组。我做错了什么？为什么控制台不能记录表单值

任何想法都将不胜感激

谢谢

---

J

你需要给出你的输入

name

属性，这样

serialize

就知道该怎么称呼他们了。我在那里非常感谢你，工作得很好。你需要给出你的输入

name

属性，这样

serialize

就知道该怎么称呼他们了。我在那里非常感谢你，工作得很好。你需要给出你的输入

name

attributes，因此

serialize

知道如何称呼它们。我在那里非常感谢您，它工作得非常好。

$('#bookingform').submit(function(event) {
// serialize
var str = $( "#bookingform" ).serialize();
console.log(str);
event.preventDefault;});

<div class="content active" id="book1">
  <form class="filter"  id="bookingform" method="post">
    <div class="row">
      <div class="small-12 columns">
        <h5>Refine Your Dates</h5>
      </div>
    </div>
    <div class="row">
      <div class="small-12 medium-5 large-2 columns">
        <label>
          Check In Date
          <input type="text" class="date-input" id="checkin-date-picker" >
          <small class="parsed-date"></small>
          <small class="error">Please enter a date DD/MM/YYYY</small>
        </label>
      </div>
      <div class="small-12 medium-5 large-2 columns">
        <label>
          Check Out Date
          <input type="text" class="date-input" id="checkout-date-picker" >
          <small class="parsed-date"></small>
          <small class="error">Please enter a date DD/MM/YYYY</small>
        </label>
      </div>
      <div class="small-12 medium-5 large-2 columns">
        <label>
          Rooms
          <select id="roomNumbers" onchange="addRoom()">
            <option value="0" selected="selected">Select</option>
            <option value="1" >1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
          </select>
        </label>
      </div>

      <div id="roomGuestForm" class="small-12 medium-5 large-4 columns child-guest-select" ng-controller="ExampleController"></div>
      <div class="small-12 medium-5 large-2 columns">
        <button type="submit" class="hunt-button" id="roomformbutton">Hunt <i class="fa fa-angle-right"></i></button>
      </div>
</div>


  </form>