JS来动态的修改url实现对url的增删查改


Posted in Javascript onSeptember 05, 2014

虽然可以通过get方式提交post表单等方式来动态修改url,但如果多个按钮能并行提交时,写多个大体相同,又有些细节差异的表单,难免有些不妥,因此,想到了通过JS来动态的修改url,来实现对url的增删查改。

<script>

var LG=(function(lg){
var objURL=function(url){
this.ourl=url||window.location.href;
this.href="";//?前面部分
this.params={};//url参数对象
this.jing="";//#及后面部分
this.init();
}
//分析url,得到?前面存入this.href,参数解析为this.params对象,#号及后面存入this.jing
objURL.prototype.init=function(){
var str=this.ourl;
var index=str.indexOf("#");
if(index>0){
this.jing=str.substr(index);
str=str.substring(0,index);
}
index=str.indexOf("?");
if(index>0){
this.href=str.substring(0,index);
str=str.substr(index+1);
var parts=str.split("&");
for(var i=0;i<parts.length;i++){
var kv=parts[i].split("=");
this.params[kv[0]]=kv[1];
}
}
else{
this.href=this.ourl;
this.params={};
}
}
//只是修改this.params
objURL.prototype.set=function(key,val){
this.params[key]=val;
}
//只是设置this.params
objURL.prototype.remove=function(key){
this.params[key]=undefined;
}
//根据三部分组成操作后的url
objURL.prototype.url=function(){
var strurl=this.href;
var objps=[];//这里用数组组织,再做join操作
for(var k in this.params){
if(this.params[k]){
objps.push(k+"="+this.params[k]);
}
}
if(objps.length>0){
strurl+="?"+objps.join("&");
}
if(this.jing.length>0){
strurl+=this.jing;
}
return strurl;
}
//得到参数值
objURL.prototype.get=function(key){
return this.params[key];
} 
lg.URL=objURL;
return lg;
}(LG||{}));


var myurl=new LG.URL(window.location.href);
myurl.remove("b"); //删除了b
alert(myurl.get ("a"));//取参数a的值,这里得到1
myurl.set("a",23); //修改a的值为23
alert (myurl.url());
</script>
Javascript 相关文章推荐
基于Jquery的标签智能验证实现代码
Dec 27 Javascript
JavaScript中的prototype和constructor简明总结
Apr 05 Javascript
Javascript对象Clone实例分析
Jun 09 Javascript
基于ajax实现文件上传并显示进度条
Aug 03 Javascript
ES6中Proxy代理用法实例浅析
Apr 06 Javascript
JS简单验证上传文件类型的方法
Apr 17 Javascript
jQuery 1.9版本以上的浏览器判断方法代码分享
Aug 28 jQuery
Angularjs实现上传图片预览功能
Sep 01 Javascript
Vue 2.5.2下axios + express 本地请求404的解决方法
Feb 21 Javascript
angular6.0使用教程之父组件通过url传递id给子组件的方法
Jun 30 Javascript
微信小程序在线客服自动回复功能(基于node)
Jul 03 Javascript
javascript实现获取中文汉字拼音首字母
May 19 Javascript
jQuery表格插件datatables用法总结
Sep 05 #Javascript
jQuery中index()的用法分析
Sep 05 #Javascript
使用jquery解析XML的方法
Sep 05 #Javascript
JavaScript避免内存泄露及内存管理技巧
Sep 05 #Javascript
javascript获取dom的下一个节点方法
Sep 05 #Javascript
原生JavaScript生成GUID的实现示例
Sep 05 #Javascript
javascript动态控制服务器控件实例
Sep 05 #Javascript
You might like
新版mysql+apache+php Linux安装指南
2006/10/09 PHP
让PHP COOKIE立即生效,不用刷新就可以使用
2011/03/09 PHP
php中存储用户ID和密码到mysql数据库的方法
2013/02/06 PHP
解析centos中Apache、php、mysql 默认安装路径
2013/06/25 PHP
php连接oracle数据库的方法(测试成功)
2016/05/26 PHP
浅谈PHP正则中的捕获组与非捕获组
2016/07/18 PHP
PHP7常量数组用法分析
2016/09/26 PHP
YII2框架中添加自定义模块的方法实例分析
2020/03/18 PHP
发布一个高效的JavaScript分析、压缩工具 JavaScript Analyser
2007/11/30 Javascript
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
2010/08/13 Javascript
Jquery.TreeView结合ASP.Net和数据库生成菜单导航条
2010/08/27 Javascript
JS保留两位小数 四舍五入函数的小例子
2013/11/20 Javascript
js实现交换运动效果的方法
2015/04/10 Javascript
JS+CSS实现的经典tab选项卡效果代码
2015/09/16 Javascript
javascript 注释代码的几种方法总结
2017/01/04 Javascript
vue2.0实现倒计时的插件(时间戳 刷新 跳转 都不影响)
2017/03/30 Javascript
JS排序之冒泡排序详解
2017/04/08 Javascript
Bootstrap组件之下拉菜单,多级菜单及按钮布局方法实例
2017/05/25 Javascript
jQuery实现的表格前端排序功能示例
2017/09/18 jQuery
Vue.js原理分析之nextTick实现详解
2020/09/07 Javascript
ant design vue导航菜单与路由配置操作
2020/10/28 Javascript
在antd中setFieldsValue和defaultVal的用法
2020/10/29 Javascript
[55:02]2014 DOTA2国际邀请赛中国区预选赛 HGT VS Orenda
2014/05/21 DOTA
python的socket编程入门
2018/01/29 Python
python+opencv实现霍夫变换检测直线
2020/10/23 Python
TensorFlow基于MNIST数据集实现车牌识别(初步演示版)
2019/08/05 Python
详解python中eval函数的作用
2019/10/22 Python
CSS3实现时间轴效果
2016/07/11 HTML / CSS
施华洛世奇新加坡官网:SWAROVSKI新加坡
2020/10/06 全球购物
高三学习决心书
2014/03/11 职场文书
怎样拟定创业计划书
2014/05/01 职场文书
秋冬农业生产标语
2014/10/09 职场文书
小学运动会加油词
2015/07/18 职场文书
受欢迎的自荐信,就这么写!
2019/04/19 职场文书
导游词之苏州寒山寺
2019/12/05 职场文书
pytorch 两个GPU同时训练的解决方案
2021/06/01 Python