<script type="text/javascript"> //通過$("標簽"),也可以使用id的點擊事件 $("a").click(function () { //var id = [[${book.getBook_id()}]];這里是thymeleaf在外部取值 //var category = [[${book.getBook_category()}]]; $.ajax({ //異步請求的url,參數是data,后台也是走Controller url : "http://localhost:8080/toModuleOne", type : "GET", headers:{"Content-Type":"application/json;charset=UTF-8"}, data: { "id": [[${book.getBook_id()}]], "category": [[${book.getBook_category()}]] }, success: function(data) {//ajax請求成功后觸發的方法 alert('請求成功'); }, error : function(data){ alert("請求失敗!"); } }); }); </script>
//使用點擊事件,執行方法如果頁面中有多個相同的方法,只識別最后一個(我在th:each遍歷時以下a標簽生成多個,但是只執行最后一個) <a onclick="myFunction()" th:text="${book.getBook_name()}"></a> function myFunction() { ... //使用id出發點擊事件,定義多個相同id也只識別一個 <a id="a" th:text="${book.getBook_name()}"></a> $("#a").click(function () { ... ////使用點擊事件,執行方法傳參(其他方式的傳參一直失敗) <a onclick="myFunction(this.id,this.name)" th:id="${book.getBook_id()}" th:name="${book.getBook_category()}" th:text="${book.getBook_name()}"></a> <script type="text/javascript"> //接受參數 function myFunction(id,category) { $.ajax({ url : "http://localhost:8080/toModuleOne", type : "Get", headers:{"Content-Type":"application/json;charset=UTF-8"}, data: {"id": id,"category": category}, dataType : "html", success: function(data) {//ajax請求成功后觸發的方法 //重新加載頁面window.location.reload();
document.write(data);//data就是異步請求執行Controller后,返回的數據,這里是整個頁面(所有標簽和數據) document.close();//這里需要關閉,不然頁面會疊加
//或者使用下面的方式替換頁面,不過新的頁面js樣式可能會失效: //標簽:$("body").html(data); //id:$("#content-wrapper").html(data); }, error : function(data){ alert("請求失敗!"); } }); }; </script>