<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>保存</title><style> html body { margin:0px;padding:0px} li{ display: inline; margin-right:25px; padding-top:15px!important; } ul{ margin-top:0px; padding-top:12px; } #One{ margin-left:10%; } a{ font-size:25px } #CD{ height:60px; background-color:blue; } a{ text-decoration:none } a a:link{ color:white; } a:visited{ color:white; } a:active{ color:white; } a:hover { color:red; } #nr{ margin-top:5%; margin-left:10%;} </style> </head> <body> <div id="CD"> <ul> <li id="One"><a href="findAllUser.html" >查询所有</a></li> <li><a href="findOneUser.html" >查询单个</a></li> <li><a href="save.html" >增加</a></li> <li><a href="update.html" >删除</a></li> <li><a href="update.html" >修改</a></li> </ul> </div> <div id="nr"> id<input type="text" name="id" id="id" style="margin-left: 34px"><br> 名字<input type="text" name="firstName" id="firstName" style="margin-left: 16px"><br> 姓<input type="text" name="lastName" id="lastName" style="margin-left: 32px"><br> 邮箱<input type="text" name="email" id="email" style="margin-left: 16px"><br> 手机号<input type="text" name="mobile" id="mobile" ><br> 生日<input type="text" name="dateOfBirth" id="dateOfBirth" style="margin-left: 16px"><br><br> <button>保存</button><br><br> </div> <script src="jquery-3.3.1.min.js"></script> <script type="text/javascript"> $("button").on('click',function(){ $obj={"id": $("#id").val(),"firstName": $("#firstName").val(),"lastName": $("#lastName").val(),"email": $("#email").val(),"mobile": $("#mobile").val(),"dateOfBirth": $("#dateOfBirth").val()}; //alert(JSON.stringify($obj)); //alert($obj); $.ajax({ cache: false, crossDomain: true, url: "http://192.168.0.120:8080/customers/", type: "POST", dataType:"json", contentType:"application/json", data:JSON.stringify($obj), success: function(data) { console.log(data); } }); }); </script> </body> </html>