怎样使用Jquery获取form表单数据

直接上代码let json = $('#form-box').serialize(); console.log('json: ', json);

HTML

<form id="form-box">
  <input type="text" id="nickname" name="nickname" value="ECHO陈文">
  <textarea id="slogan" name="slogan">生活不止眼前的苟且,还有诗和远方的田野</textarea>
</form>

Jquery获取表单

let json = $('#form-box').serialize();
console.log('json: ', json); // 输出:json:nickname=ECHO陈文&slogan=生活不止眼前的苟且,还有诗和远方的田野

对象格式:

let data = {};
let value = $('#form-box').serializeArray();
$.each(value, function (index, item) {
  data[item.name] = item.value;
});
let json = JSON.stringify(data);
console.log(json);
/*
* 输出:{"nickname":"ECHO陈文","slogan":"生活不止眼前的苟且还有诗和远方的田野"}
*/

提交

提交可以使用jquery直接提交表单

$("#form-box").submit();

也可以通过ajax 去进行提交

$.ajax({
  type: "POST",
  url: "/json",
  data: json,
  dataType : "json",
  success: function(res){
  }
});

以上这篇怎样使用Jquery获取form表单数据就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持芦苇派。

原创文章,作者:ECHO陈文,如若转载,请注明出处:https://www.luweipai.cn/html/1676361704/

  • 0