JS.jQuery获取浏览器参数
来源:互联网 发布:nginx 静态服务器配置 编辑:程序博客网 时间:2024/05/16 12:59
今天在做搜索+分页的时候,出现了一个问题:由于我搜索之后与之前的页面用的是同一个页面,所以搜索之后的数据分页后会形成一个与搜索之前不同的列表集合,这时如果点击下一页的时候集合会混乱。我任务最简单最好的解决方法是编写两个不同的页面来显示,但是公司之前的同事为了方便设计用的是同一个页面来显示,只是SQL语句传递参数不同而已,所以才给我出来一难题。经过一天的思考与编写与测试,终于顺利完成,思想如下(此处不解释分页原理):
先是获取输入框的输入条件后付给浏览器页面地址之上,然后用以下jQuery代码来进行获取
function GetQueryString(name)
{
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r!=null)return decodeURI(r[2]); return null;
} //获取浏览器参数;
//以下为分页所需参数。
var currentPage = $("input[name='currentPage']").val();
currentPage=parseInt(currentPage);
currentPage=currentPage-1;
//alert(currentPage);当前页面
var total = $("input[name='total']").val();
total=parseInt(total);
//alert(total);总页数
var selection = GetQueryString("selection");
if(selection==null){selection='';}
var con = GetQueryString("con");
if(con==null){con='';}
var type = GetQueryString("type");
if(type==null){type='';}
if(currentPage<=0){
alert("没有此页!");
return;
}
window.location.href=encodeURI("SACMS/RDM/WebPage/pages/modelD.w.xhtml?selection="+selection+"&con="+con+"&type="+type+"&navId="+GetQueryString("navId")+"¤tPage="+currentPage);
注意:这里的decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码。
html代码:
搜索框代码:
<div class="form-group" style="width:100%;margin:0 auto;height:50;margin-top:$params.p_top;margin-left:$params.p_left;">
<div style="float:left;">
<select name="selection" class="form-control" style="background:#3f8bE1;color:#fff;" id="selection">
<option>分类</option>
<c:forEach items="$params.dynamicTable" var="tableTr" varStatus="d">
<option value="%{tableTr.code}">%{tableTr.text}</option>
</c:forEach>
</select>
</div>
<div style="background-image:url('$path.toRequest($params.backImg)');float:left;margin-left:8;">
<input type="text" id="con" name="con" style="width:320px;height:34px;border-top-width: 3px;border-left-width: 2px;
border-right-width: 2px;border-bottom-width: 2px;"/>
</div>
<div class="form-group">
<input type="image" src="$path.toRequest($params.backImg1)" style="margin-left:10px;width:$params.img_width;height:$params.img_height;"/>
<input type="hidden" name="navId" value="%{param.navId}"/>
</div>
</div>
<div class="form-group" name="wrap" style="margin:0 auto;width:100%;font-size:$params.rad_fontsize;margin-left:$params.ch_left;">
<label class="radio-inline">
<input type="radio" name="type" id="Radio1" checked="" value="$params.check1" style="width:$params.rad_fontsize;height:$params.rad_fontsize;background:#fff;"/>中文名</label>
<label class="radio-inline" style="margin-left:20;">
<input type="radio" name="type" id="Radio2" checked="" value="$params.check2" style="width:$params.rad_fontsize;height:$params.rad_fontsize;"/>学名</label>
<label class="radio-inline" style="margin-left:20;">
<input type="radio" name="type" id="Radio3" checked="" value="$params.check3" style="width:$params.rad_fontsize;height:$params.rad_fontsize;"/>科名</label>
<label class="radio-inline" style="margin-left:20;">
<input type="radio" name="type" id="Radio4" checked="" value="$params.check4" style="width:$params.rad_fontsize;height:$params.rad_fontsize;"/>产地</label>
</div>
分页按钮代码:
<table style="displayinline">
<tr><td>
<input id="First" type="button" value="$params.dynamicFirstContent" $tool.ifNotEmpty($params.onClick4,"onClick='$path.toJsMethod(${params.onClick4})'") style="background-color:#FFFFFF;height:30px;"/>
</td>
<td>
<input id="Previous" type="button" value="$params.dynamicPreviousContent" $tool.ifNotEmpty($params.onClick1,"onClick='$path.toJsMethod(${params.onClick1})'") style="background-color:#FFFFFF;height:30px;"/>
</td>
<td>
<input id="now" type="button" value="$params.currentPage/共$params.total页" style="background-color:#FFFFFF;height:30px;"/>
</td>
<td>
<input id="last" type="button" value="$params.dynamicNextContent" $tool.ifNotEmpty($params.onClick2,"onClick='$path.toJsMethod(${params.onClick2})'") style="background-color:#FFFFFF;height:30px;"/>
</td>
<td>
<input id="Last" type="button" value="$params.dynamicLastContent" $tool.ifNotEmpty($params.onClick5,"onClick='$path.toJsMethod(${params.onClick5})'") style="background-color:#FFFFFF;height:30px;"/>
</td>
<td>
<li style="float:left;margin-left:10px;color:black;">到<input type="text" name="page" value="1" onfocus="this.value=''" onblur="if(this.value==''){this.value='1'}" style="margin-right:5px;height:28px;width:30px;" />页</li>
<input id="last" type="button" value="确定" $tool.ifNotEmpty($params.onClick3,"onClick='$path.toJsMethod(${params.onClick3})'") style="background-color:#FFFFFF;height:30px;"/>
</td>
</tr>
</table>
- JS.jQuery获取浏览器参数
- js获取浏览器参数
- js获取浏览器地址栏参数
- js获取浏览器参数方法
- js/jquery 获取url参数
- js jquery 获取URL参数
- jQuery获取浏览器窗口高度等参数
- javascript浏览器参数的操作,js获取浏览器参数
- js获取屏幕尺寸及浏览器参数
- js 获取浏览器的url中的参数
- js or jquery 获取浏览器宽高
- jquery & js 获取浏览器、屏幕高度
- JQuery&JS 获取地址栏参数的方式
- [js][jQuery]JQuery获取浏览器的高度和宽度
- jquery获取Url和JS获取Url的参数值
- JS获取URL参数-支持多浏览器【转-修】
- JS获取浏览器地址参数的封装类
- Js获取浏览器的高度和宽度等参数
- windows编程笔记
- Redis微博推的实现
- 高德地图坐标转换接口
- 防止用户在页面上填写恶意代码webConfig中所做操作
- 机器学习中的相似性度量
- JS.jQuery获取浏览器参数
- 抽象 多态 继承 封装 接口 单例
- linux平台上image文件挂载的方法
- windows下tomcat和nginx负载均衡的简单配置!
- 关于listview加载图片时oom的解决方案
- 资金管理系统中的基础财务记账规则
- jstl的学习
- ps 滤镜特效
- Linux/CentOS 升级C基本运行库CLIBC的注意事项(当想解决GLIBC_2.x找不到的编译问题)