亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

ajax跳轉(zhuǎn)到新的jsp頁面的方法

 更新時間:2017年10月31日 15:10:51   作者:樂呵呵的小碼農(nóng)  
這篇文章主要介紹了ajax跳轉(zhuǎn)到新的jsp頁面的方法,在不刷新整個頁面的情況下更新頁面的局部信息,具有一定的參考價值,感興趣的小伙伴們可以參考一下

ajax可以實現(xiàn)局部刷新頁面,即在不刷新整個頁面的情況下更新頁面的局部信息。

項目中遇到一個問題:在用戶列表也,當點擊某個按鈕時需要去查詢用戶的信息,查詢成功跳轉(zhuǎn)到用戶詳情界面;查詢失敗,則在原頁面彈出提示信息。

想到兩個解決辦法:

方法一:

點擊按鈕,調(diào)用普通方法去查詢用戶信息,查詢成功跳轉(zhuǎn)到用戶詳情頁面;查詢失敗,重定向調(diào)用查詢用戶列表的方法,在查詢用戶列表的方法結束后重新跳轉(zhuǎn)到用戶列表頁面并彈出提示信息,相當于重新加載了用戶列表頁面。

方法二:

根據(jù)需求,不可以重新加載用戶列表頁面。用ajax調(diào)用查詢用戶詳情的方法,查詢成功返回用戶Json串,查詢失敗則返回error。

后臺方法:

@RequestMapping(value = "searchUser")
 public void searchHome(HttpServletResponse response){
    String result = null;
    ...
    查詢用戶的方法
    ...
 
    if(查詢成功){
       result = JsonUtil.objectToJson(查詢結果對象);//結果對象轉(zhuǎn)化成Json字符串,在ajax的結果中跳轉(zhuǎn)到用戶詳情的處理方法
       AjaxUtil.ajax(response,result);
    }else{//查詢失敗,返回提示信息
       AjaxUtil.error(response, "查詢用戶失敗");
    }  
 }

jsp頁面的ajax:

function searchUser(){
     $.ajax({
        url : "testurl/searchUser",
        cache : false,
        type : 'POST',
        data : {
          查詢用的數(shù)據(jù),比如用戶ID
        },
        success : function(data) {
          var obj = eval("("+data+")"); 
           
          if(obj.success==undefined){//查詢成功,跳轉(zhuǎn)到詳情頁面
             ...
             跳轉(zhuǎn)到用戶詳情處理方法,將date數(shù)據(jù)傳過去
             ...
          }else if(!obj.success){//查詢失敗,彈出提示信息
             weui.Loading.info(obj.message);
          }
        },
        error : function(error) {
          weui.alert("查詢用戶有誤!");
        }
     });    
  } 

此處的重點在于如何在ajax的回調(diào)函數(shù)中調(diào)用普通方法,并將之前查詢出的用戶數(shù)據(jù)傳到普通方法中(上面?zhèn)未a中紅色的部分),繼而跳轉(zhuǎn)到用戶詳情頁面。

(1)錯誤案例:

function searchUser(){
      $.ajax({
        url : "testurl/searchUser",
        cache : false,
        type : 'POST',
        data : {
           查詢用的數(shù)據(jù),比如用戶ID
        },
        success : function(data) {
           var obj = eval("("+data+")");
           if(obj.success==undefined){//查詢成功,跳轉(zhuǎn)到詳情頁面,encodeURIComponent編碼是為了防止url后面?zhèn)魉偷膮?shù)中文亂碼,在后臺處理時需要解碼
             window.location.href = "testurl/userForm?userJson="+encodeURIComponent(data);
           }else if(!obj.success){//查詢失敗,彈出提示信息
              weui.Loading.info(obj.message);
           }
        },
        error : function(error) {
           weui.alert("查詢用戶有誤!");
        }
      });    
   }

錯誤原因:window.location.href方法為get方法,這會使得參數(shù)顯示的瀏覽器的url中,不安全,并且數(shù)據(jù)傳送的長度有限制。 

(2)想到的笨方法:在body中寫隱藏的form表單,在回調(diào)函數(shù)中把查到的用戶數(shù)據(jù)復制給form表單中的input,然后提交表單跳轉(zhuǎn)到普通方法中,這樣就是以post方法提交的數(shù)據(jù),并且可以跳轉(zhuǎn)到新頁面了:

function searchUser(){
      $.ajax({
        url : "testurl/searchUser",
        cache : false,
        type : 'POST',
        data : {
           查詢用的數(shù)據(jù),比如用戶ID
        },
        success : function(data) {
           var obj = eval("("+data+")");
           if(obj.success==undefined){//查詢成功,跳轉(zhuǎn)到詳情頁面
             $("#userFormJson").val(data);
             $("#userForm").attr("action","testurl/userForm");
             $("#userForm").submit();
           }else if(!obj.success){//查詢失敗,彈出提示信息
              weui.Loading.info(obj.message);
           }
        },
        error : function(error) {
           weui.alert("查詢用戶有誤!");
        }
      });    
   } 

jsp頁面的body

<body>
  <form id="userForm" action="" method="post">
    <input id="userFormJson" name="userFormJson" type="hidden"/>
  </form>
</body>

以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。

相關文章

最新評論