jquery 实现页面参数传递,并获取相关请求参数分析

符号 阅读:274 2021-03-31 23:31:00 评论:0

第一步:指定跳转的页面,并填充相关的请求参数:

<!DOCTYPE html> 
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]--> 
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]--> 
<!--[if gt IE 8]><!--> 
<html class="no-js"> 
<!--<![endif]--> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<title>查看所有手机品牌接口</title> 
<meta name="description" content=""> 
<meta name="viewport" content="width=device-width"> 
<link rel="stylesheet" href="css/bootstrap.min.css"> 
<!--核心 js文件  --> 
<script src="js/jquery-1.8.3.js" type="text/javascript"></script> 
<script src="js/md5.js" type="text/javascript"></script> 
<script src="js/aes.js" type="text/javascript"></script> 
<script src="js/core-min.js" type="text/javascript"></script> 
<script src="js/json2.js" type="text/javascript"></script> 
 
 
<!--if IE 7]> 
	<link rel="stylesheet" href="css/font-awesome-ie7.min.css">			 
<![endif]--> 
<!--自定义相关js 文件  --> 
<script language="Javascript"> 
$(document).ready(function(){ 
 
		 
   var json='{"platform":"2"}'; 
   //执行异步请求 
    var url_ = 'http://202.103.124.70:8085/services/phoneDataInterface'; 
	var param = '{"data":'+json+',"serviceCode":"TTP_PHONE_Q_BRAND"}'; 
	 
	 var contents=JSON.stringify(param);  
     alert(contents); 
	$.ajax({ 
	    type:'post', 	     
	    url:url_, 
	    data:param, 
	    dataType:"json",	         	     
	    success:function(data){	  
	       //所有手机型号 
	    	$.each(data.result,function(id, rowData) {	    	 
	    	  //alert(id+":rowData.id="+rowData.id+",rowData.bandName="+rowData.bandName); 
	    	   $("#cs").append("<li style=\"float:; margin-top:3px;margin-left:10px;background: url(images/qx.png) no-repeat;\"><a href=\"#\" class=\"\" οnclick=\"aa(" + rowData.id + ");\">" + rowData.bandName + "</a></li>");   
	    	 }); 
	    	 
	   }, 
	   error:function(XmlHttpRequest,textStatus, errorThrown){ 
	       alert("删除失败"+XmlHttpRequest.responseText); 
	       alert("相关信息"+XMLHttpRequest.readyState); 
	       alert("相关信息1"+XMLHttpRequest.status);	       
	       alert("响应状态"+textStatus); 
	       alert("异常信息"+errorThrown); 
	   }	    
	}); 
    
     
   
    
    
    
    
    
    
    
   
 
      
  
});  
//查询指定品牌的销售量 
function aa(index){    
	   //使用location.href进行页面相关参数传递---重点代码 
	   window.location.href="search.html?id="+index+"";   
}      
 
</script> 
</head> 
<body> 
	<br /> 
 
 
	<div class="span3"> 
		<ul class="nav nav-pills nav-stacked" id="cs" 
			style="font-size:18px;text-align:center;"> 
 
		</ul> 
	</div> 
 
 
</body>


第二步:获取location.href的相关请求参数:

<!DOCTYPE html> 
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]--> 
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]--> 
<!--[if gt IE 8]><!--> 
<html class="no-js"> 
<!--<![endif]--> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<title>查询指定品牌的商品</title> 
<meta name="description" content=""> 
<meta name="viewport" content="width=device-width"> 
<link rel="stylesheet" href="css/bootstrap.min.css"> 
<link rel="stylesheet" href="css/bootstrap-responsive.min.css"> 
<script src="js/bootstrap.min.js" type="text/javascript"></script>  
<!--核心 js文件  --> 
 <script src="js/jquery-1.8.3.js" type="text/javascript"></script>  
 <script src="js/md5.js" type="text/javascript"></script>  
 <script src="js/aes.js" type="text/javascript"></script>  
 <script src="js/core-min.js" type="text/javascript"></script>  
 <script src="js/json2.js" type="text/javascript"></script> 
 
<!--自定义相关js 函数  --> 
<script language="Javascript"> 
    //获取location.href相关请求参数 
	String.prototype.getQuery = function(name) { 
		var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); 
		var r = this.substr(this.indexOf("\?") + 1).match(reg); 
		if (r != null) 
			return unescape(r[2]); 
		return null; 
	} 
 
	$(document).ready(function() { 
	    var Url = window.location.href; 
        var id =Url.getQuery("id"); 
		alert("获取指定参数的值:" + id) 
	}); 
</script> 
</head> 
<body> 
<br/> 
 
	<div class="container"> 
	     <div class="row"> 
	          <div class="span4"> 
	             
	          </div> 
	     </div> 
	        	 
    </div> 
 
</body>

相关效果展示:



声明

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

发表评论
搜索
KIKK导航

KIKK导航

排行榜
关注我们

一个IT知识分享的公众号