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


Posted in Javascript onSeptember 01, 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 EasyUI API 中文文档 - DataGrid数据表格
Nov 17 Javascript
javascript返回顶部效果(自写代码)
Jan 06 Javascript
js操作CheckBoxList实现全选/反选(在客服端完成)
Feb 02 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
Jul 04 Javascript
Node.js中对通用模块的封装方法
Jun 06 Javascript
JS Attribute属性操作详解
May 19 Javascript
KnockoutJS 3.X API 第四章之数据控制流foreach绑定
Oct 10 Javascript
详解Vue自定义过滤器的实现
Jan 10 Javascript
JS沙箱模式实例分析
Sep 04 Javascript
JavaScript中错误正确处理方式小结你用对了吗
Oct 10 Javascript
vue引入新版 vue-awesome-swiper插件填坑问题
Jan 25 Javascript
Vue混入mixins滚动触底的方法
Nov 22 Javascript
一个不错的仿携程自定义数据下拉选择select
Sep 01 #Javascript
原生javascript实现拖动元素示例代码
Sep 01 #Javascript
使用text方法获取Html元素文本信息示例
Sep 01 #Javascript
textarea不能通过maxlength属性来限制字数的解决方法
Sep 01 #Javascript
超级好用的jQuery圆角插件 Corner速成
Aug 31 #Javascript
Html5的placeholder属性(IE兼容)实现代码
Aug 30 #Javascript
通过js为元素添加多项样式,浏览器全兼容写法
Aug 30 #Javascript
You might like
PHP与SQL语句写一句话木马总结
2019/10/11 PHP
在Laravel中使用GuzzleHttp调用第三方服务的API接口代码
2019/10/15 PHP
设置iframe的document.designMode后仅Firefox中其body.innerHTML为br
2012/02/27 Javascript
MultiSelect左右选择控件的设计与实现介绍
2013/06/08 Javascript
jQuery $.extend()用法总结
2014/06/15 Javascript
Javascript基础教程之函数对象和属性
2015/01/18 Javascript
JS实现向表格行添加新单元格的方法
2015/03/30 Javascript
javascript实现验证IP地址等相关信息代码
2015/05/10 Javascript
JSON遍历方式实例总结
2015/12/07 Javascript
Javascript数组Array基础介绍
2016/03/13 Javascript
JS判断是否手机或pad访问实现方法
2016/12/09 Javascript
JS出现失效的情况总结
2017/01/20 Javascript
vue2 如何实现div contenteditable=“true”(类似于v-model)的效果
2017/02/08 Javascript
利用ECharts.js画K线图的方法示例
2018/01/10 Javascript
浅谈Vue网络请求之interceptors实际应用
2018/02/28 Javascript
Vue实现剪贴板复制功能
2019/12/31 Javascript
用VsCode编辑TypeScript的实现方法
2020/05/07 Javascript
linux下python抓屏实现方法
2015/05/22 Python
用Python设计一个经典小游戏
2017/05/15 Python
利用python库在局域网内传输文件的方法
2018/06/04 Python
python实现的自动发送消息功能详解
2019/08/15 Python
PyTorch中Tensor的维度变换实现
2019/08/18 Python
python GUI库图形界面开发之PyQt5打印控件QPrinter详细使用方法与实例
2020/02/28 Python
python使用openpyxl操作excel的方法步骤
2020/05/28 Python
Python实现迪杰斯特拉算法过程解析
2020/09/18 Python
Python基于tkinter canvas实现图片裁剪功能
2020/11/05 Python
Desigual英国官网:在线购买原创服装
2018/03/09 全球购物
函授大专自我鉴定
2013/11/01 职场文书
汽车专业人才自我鉴定范文
2013/12/29 职场文书
教师对学生的寄语
2014/04/03 职场文书
优秀本科毕业生自荐信
2014/07/04 职场文书
优秀共产党员事迹材料
2014/12/18 职场文书
2015年度优秀员工推荐信
2015/03/23 职场文书
农民工工资承诺书大全
2015/05/04 职场文书
雷锋电影观后感
2015/06/10 职场文书
python基础学习之生成器与文件系统知识总结
2021/05/25 Python