JQuery获取form表单数据

1.首先页面的form的所有表单元素需要增加name属性

<div class="form-group">
  <label for="name" class="col-md-2 control-label">数据源名称：</label>

  <div class="col-md-8">
    <input type="text" class="form-control" placeholder="请输入数据源名称" name="name" id="name" title="数据源名称" />
  </div>
</div>

<div class="form-group">
  <label for="type" class="col-md-2 control-label">数据库类型：</label>

  <div class="col-md-8">
    <select class="form-control" name="type" id="type" title="数据库类型">
      <option value="1" selected="selected">
        Mysql
      </option>

      <option value="2">
        Oracle
      </option>
    </select>
  </div>
</div>

2.获取表单数据的方式一：

let json = $('#addDataSourceForm').serialize();
console.log('json : ', json); // 输出：name=asd&type=1

3.获取表单数据的方式二：

let data = {};
let value = $('#addDataSourceForm').serializeArray();
$.each(value, function (index, item) {
    data[item.name] = item.value;
});
let json = JSON.stringify(data);
console.log('json : ', json);
/** 输出：{"name":"asd","type":"1"}*/

根据自己需要的格式选择吧。

原文链接：https://blog.csdn.net/BAStriver/article/details/82910269