js跳转页面通过url传递数据 (html？id=1)，下个界面查数据库

js跳转页面 (html？id=1)，下个界面查数据库

1.第一个界面跳转，通过url传递数据

$(document).on("click",".to",function(){
 //.atter("id") 属性值获取
 var id=$(this).attr("id");
 
 console.log(id);
   //把json字符串转化为json对象
   //data =JSON.parse(data);
   window.location.href = "hbuthree.html?id="+id;
  //"?"是一个分界线，后面是要传给下一界面的数据
  //引号里的“id”是参数名，加号后是参数值
 })

2.下一界面接收数据

2.1进页面就刷新，并查数据库

//下面函数一进页面就刷新，比el强，区别可看我的上个博客
 $(function(){
      var data=getRequest();
      var id=data.id[0];
      console.log(id);
      $.ajax({
    url:"/hbunews/newsServlet",
    async:true,
    type:"post",
    data:{
     "action":"findContent",
     "id":id
    },
    success:function(data){
     
     //把json字符串转化为json对象
     console.log(data);
     data =JSON.parse(data);
     if(data.code==200){
      loadData(data.data);
     }
     //alert("重新遍历");
     layer.msg('页面已刷新');
    },
    error:function(error){
     layer.msg('裂开');
    }
   })
      
      
      
     })

2.2接收url并分割出数据函数

 //接收url并分割出数据
     var getRequest =function() {
      //window.location.search是直接拿到整个url如”http://localhost:8080/hbunews/hbuthree.html?id=1“
      //window.location.html是拿到"?""后面数据，如"id=1"",可不用当前函数，直接url.split("?")[1].split("=")[1]得到"id"的值;
      //不过本函数可解决中文乱码问题
     // 
        var url = window.location.search;
        alert(url);
        var strs = [];
        var theRequest = new Object();
        if (url.indexOf("?") != -1) {
          var str = url.substr(1);
           strs = str.split("&");
          for(var i = 0; i < strs.length; i ++) {
            theRequest[strs[i].split("=")[0]]=decodeURIComponent(strs[i].split("=")[1]);
          }
        }
       return theRequest;
     };

2.3加载内容函数

//加载内容函数
     function loadData(data){
   $(".te").empty();
   //JSON .parse(data);
   console.log(typeof data);
   if(data.length!=0){
   for(var i=0;i<data.length;i++){
    $(".te").append(data[i]);
   }
   }else{
    $(".content").append("<li>没有新闻</li>");
   }
  }