<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"/> <title>修改折扣</title> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $(document).ready(function () { method() }); function method() { $.ajax({ type:"GET", url:"/guest/selectInvestorDiscount", // data:{"id":val}, // data参数是可选的，有多种写法，也可以直接在url参数拼接参数上去，例如这样：url:"getUser?id="+val, //data:"id="+val, async:true, // 异步，默认开启，也就是$.ajax后面的代码是不是跟$.ajx里面的代码一起执行 cache:true, // 表示浏览器是否缓存被请求页面,默认是 true dataType:"json", // 返回浏览器的数据类型，指定是json格式，前端这里才可以解析json数据 success:function(data){ $("#discount").text(data); }, error:function(){ console.log("发生错误") alert("发生错误"); }, complete:function(){ console.log("ajax请求完事，最终操作在这里完成") } }); } </script> <script> function updateDiscount() { var val = $("#discouts").val(); $.ajax({ type:"POST", url:"/guest/upDiscountByType", data:{"discouts":val}, // data参数是可选的，有多种写法，也可以直接在url参数拼接参数上去，例如这样：url:"getUser?id="+val, //data:"id="+val, async:true, // 异步，默认开启，也就是$.ajax后面的代码是不是跟$.ajx里面的代码一起执行 cache:true, // 表示浏览器是否缓存被请求页面,默认是 true dataType:"json", // 返回浏览器的数据类型，指定是json格式，前端这里才可以解析json数据 success:function(data){ console.log("成功的回调") location.reload() }, error:function(){ console.log("发生错误") alert("发生错误"); }, complete:function(){ console.log("ajax请求完事，最终操作在这里完成") location.reload() } }); } </script> </head> <body> <div> <div>当前折扣：<span id="discount"></span></div> <input type="text" id="discouts" placeholder="请输入折扣"/> <button onclick="updateDiscount();">修改</button> </div> </body> </body> </html>