form 表单内容序列化成一个字符串

html

html 复制代码
<form id="form1" action="http://localhost:8080/xxx" method="post">    
     <p >关键字1: <input type ="text" name="keyword1" /></p>    
     <p >关键字2: <input type ="text" name="keyword2" /></p>    
     <p >关键字3: <input type ="text" name="keyword3" /></p>    
     <input type ="submit" value="提交"/>    
</form> 

form 表单数据转 json 对象

复制代码
$( '#form1').serialize()

ajax 调用时提交表单数据

js 复制代码
$.ajax({  
     url : "http://localhost:8080/xxx",  
     type : "POST",  
     data : $( '#form1').serialize(),  
     success : function(data) {  
          $( '#serverResponse').html(data);  
     },  
     error : function(data) {  
          $( '#serverResponse').html(data.status + " : " + data.statusText + " : " + data.responseText);  
     }  
}); 
相关推荐
试图让你心动3 小时前
原生input添加删除图标类似vue里面移入显示删除[jquery]
前端·vue.js·jquery
Ares-Wang4 天前
Jquery、Vue 、Ajax、axios、Fetch区别
vue.js·ajax·jquery
Trust yourself2436 天前
JQuery Easyui引入easyui-lang-zh_CN.js后出现乱码的问题解决方法
javascript·jquery·easyui
万能小锦鲤15 天前
《Java Web程序设计》实验报告四 Java Script前端应用和表单验证
eclipse·jquery·java web·表单验证·实验报告·java script·java web程序设计
Hilaku19 天前
从一个实战项目,看懂 `new DataTransfer()` 的三大妙用
前端·javascript·jquery
旷世奇才李先生23 天前
jQuery EasyUI 安装使用教程
前端·jquery·easyui
保持学习ing1 个月前
SpringBoot电脑商城项目--创建订单+统计业务方法耗时
java·spring boot·spring·springmvc·jquery
保持学习ing1 个月前
SpringBoot电脑商城项目--显示勾选+确认订单页收货地址
java·前端·spring boot·后端·交互·jquery
SuperherRo1 个月前
Web攻防-XSS跨站&浏览器UXSS&突变MXSS&Vue&React&Electron框架&JQuery库&写法和版本
vue.js·electron·jquery·react·xss·mxss·uxss
未来之窗软件服务1 个月前
jquery 赋值时不触发change事件解决——仙盟创梦IDE
前端·javascript·jquery·仙盟创梦ide·东方仙盟