ajax與spring boot web聯調
阿新 • • 發佈：2018-10-01
click port ria button 應用 emp name form oot
aajax.html
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> </head> <body> <h3>請輸入你的信息：</h3> <form id="userForm"> user:<input type="text" name="user" value="孫悟空" /><br/> 喜歡的圖書：<select multiple="multiple" name="books"> <option value ="java">瘋狂JAVA講義</option> <option value ="javaee">輕量級java ee企業應用實戰</option> <option value ="ajax">瘋狂前端開發講義</option> <option value ="xml">瘋狂XML講義</option> </select><br/> <input type="button" name="load" id="load" value="Load" /> </form><hr/> <input type="button" name="ttt" id="test" value="test" /> <div id="show"></div> <script src="js/jquery-3.1.1.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> $("#load").click(function(){ $.ajax({ url:"http://127.0.0.1:8080/pro", contenttype:"application/text,charset=utf-8", type:"POST", data:$("#userForm").serialize(), dataType:"html", success:function(msg){ console.log(msg); $("#show").empty(); $("#show").html(msg); }, complete:function(req,status){ console.log(req+"\ncomplete:"+status); }, error:function(data,req,status,error){ console.log(data+"\n"+req+"\n"+status+"\n"+error); }, }); }); $("#test").click(function(){ $("#show").html($("#userForm").serialize()); }); </script> </body> </html>
ProControll
package com.eob.demoajax; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.CrossOrigin; import org.springframework.web.bind.annotation.RequestMapping; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.io.PrintWriter; import java.util.Date; @Controller @RequestMapping("/") @CrossOrigin public class ProControll { @RequestMapping("/pro") public void sayHello(HttpServletRequest request, HttpServletResponse response) throws IOException { response.setContentType("text/html;charset=utf-8"); request.setCharacterEncoding("utf-8"); //response.setHeader("Access-Control-Allow-Origin","*"); PrintWriter out=response.getWriter(); String user=request.getParameter("user"); String[] books=request.getParameterValues("books"); out.println(user+",你好，現在時間是："+new Date()); out.println("<br/>你喜歡的圖書如下："); out.println("<ol>"); for (int i=0;i<books.length;i++){ out.println("<li>"+books[i]+"</li>"); } out.println("</ol>"); System.out.println(user+":"+books); } }
ajax與spring boot web聯調