JQuery post json 資料提交心得
阿新 • • 發佈:2019-01-06
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3個meta標籤*必須*放在最前面,任何其他內容都*必須*跟隨其後! --> <meta name="description" content=""> <meta name="author" content=""> <title>Signin Template for Bootstrap</title> <script src="js/jquery-3.2.1.js"></script> <!-- Bootstrap core CSS --> <link href="css/bootstrap.css" rel="stylesheet"> <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> <link href="css/ie10-viewport-bug-workaround.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="css/signin.css" rel="stylesheet"> <!-- Just for debugging purposes. Don't actually copy these 2 lines! --> <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]--> <script src="js/ie-emulation-modes-warning.js"></script> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!--[if lt IE 9]> <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script> <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <script> $(document).ready(function(){ $("button").click(function(){ alert(JSON.stringify(GetJsonData())) $.ajax({ contentType: 'application/json', type: 'POST', url: "http://192.168.0.1:8082/api/User/UserToken", dataType: "json", data: JSON.stringify(GetJsonData()), success: function (message) { if(message.err.code) alert(message.err.code); if(message.err.code)){ alert(message.err.code); } }, error: function (message) { console.log(message); alert("提交資料失敗!888"+message); } }); }); function GetJsonData() { var json = { "username":$("#inputUsername").val(), "password":$("#inputPassword").val() }; return json; } }); </script> <body> </head> <body> <div class="container"> <form class="form-signin" > <h2 class="form-signin-heading">Please sign in</h2> <input type="email" id="inputUsername" class="form-control" placeholder="username" required autofocus> <input type="password" id="inputPassword" class="form-control" placeholder="Password" required> <button class="btn btn-lg btn-primary btn-block" >Sign in</button> </form> </div> <!-- /container --> <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> <script src="js/ie10-viewport-bug-workaround.js"></script> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <!-- Just to make our placeholder images work. Don't actually copy the next line! --> </body> </html>
注意:contentType: 'application/json',
type: 'POST',
程式的要求:post提交,json傳資料