標籤：javascrip ali res .ajax jsp 接收 function func 資料
jsp
首先建立index.jsp頁面
<script type="text/javascript"> $(function () { $("#username").click(function () { $.ajax({ url: "list",//請求地址 type: "POST", dataType: "json", success: function(data) {//data是預設的，接收前台返回的資料 //alert("success"); $.each(data, function(index,element) {//迴圈 $("#tr").append("<th>"+element.userid+"</th>"); $("#tr").append("<th>"+element.username+"</th>"); $("#tr").append("<th>"+element.password+"</th>"); }) } }); });</script></head><body> <table align="left" border="1" cellpadding="10" cellspacing="0" id="form"> <tr> <th>id</th> <th>使用者名稱</th> <th>密碼</th> </tr> <tr id="tr"> </tr> </table></body>
controller
上面index.jsp發送list請求，接下來是處理請求的controller
@Controllerpublic class UserController { private static final String NONE = null; //注入ProductService @Autowired private UserMapper userMapper; /** * 查詢所有使用者 * @return */ @RequestMapping("/list") @ResponseBody//返回json格式的資料 public List<User> List(){ List<User> list = userMapper.list(); return list; }}
Mapper.xml
<mapper namespace="com.ssm.mapper.UserMapper"> <!-- 查詢所有使用者--> <select id="list" resultType="com.ssm.entity.User"> select * from user </select></mapper>
User
public class User { private Integer userid; private String username; private String password;}
springmvc通過ajax非同步請求返回json格式資料
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
