通过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 相关文章推荐
用JS写的一个TableView控件代码
Jan 23 Javascript
神奇的7个jQuery 3D插件整理
Jan 06 Javascript
原生js实现跨浏览器获取鼠标按键的值
Apr 08 Javascript
jquery+json实现数据列表分页示例代码
Nov 15 Javascript
JavaScript原生节点操作小结
Jan 17 Javascript
vue-resource 拦截器使用详解
Feb 21 Javascript
移动端触屏幻灯片图片切换插件idangerous swiper.js
Apr 10 Javascript
vue2.0全局组件之pdf详解
Jun 26 Javascript
关于Stream和Buffer的相互转换详解
Jul 26 Javascript
javascript按顺序加载运行js方法
Dec 01 Javascript
jQuery实现雪花飘落效果
Aug 02 jQuery
JavaScript嵌入百度地图API的最详细方法
Apr 16 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
第4章 数据处理-php数组的处理-郑阿奇
2011/07/04 PHP
php中用socket模拟http中post或者get提交数据的示例代码
2013/08/08 PHP
php获取服务器端mac和客户端mac的地址支持WIN/LINUX
2014/05/15 PHP
浅谈Laravel模板实体转义带来的坑
2019/10/22 PHP
JQUERY 获取IFrame中对象及获取其父窗口中对象示例
2013/08/19 Javascript
深入理解JQuery keyUp和keyDown的区别
2013/12/12 Javascript
JavaScript插件化开发教程(五)
2015/02/01 Javascript
jQuery解析XML文件同时动态增加js文件的方法
2015/06/01 Javascript
js 判断所选时间(或者当前时间)是否在某一时间段的实现代码
2015/09/05 Javascript
Prototype框架详解
2015/11/25 Javascript
JS基于MSClass和setInterval实现ajax定时采集信息并滚动显示的方法
2016/04/18 Javascript
jQuery文本框得到与失去焦点动态改变样式效果
2016/09/08 Javascript
Jquery on绑定的事件 触发多次实例代码
2016/12/08 Javascript
在 Angular 中实现搜索关键字高亮示例
2017/03/21 Javascript
vue跨域解决方法
2017/10/15 Javascript
angular动态表单制作
2018/02/23 Javascript
发布一款npm包帮助理解npm的使用
2019/01/03 Javascript
js 实现watch监听数据变化的代码
2019/10/13 Javascript
Vue防止白屏添加首屏动画的实例
2019/10/31 Javascript
vue缓存之keep-alive的理解和应用详解
2020/11/02 Javascript
python比较两个列表大小的方法
2015/07/11 Python
Python使用修饰器执行函数的参数检查功能示例
2017/09/26 Python
使用pygame模块编写贪吃蛇的实例讲解
2018/02/05 Python
django 发送手机验证码的示例代码
2018/04/25 Python
对Python的zip函数妙用,旋转矩阵详解
2018/12/13 Python
浅谈Python基础—判断和循环
2019/03/22 Python
python使用Paramiko模块实现远程文件拷贝
2019/04/30 Python
用python对oracle进行简单性能测试
2020/12/05 Python
HTML5实践-图片设置成灰度图
2012/11/12 HTML / CSS
俄罗斯花园种植材料批发和零售网上商店:Беккер
2019/07/22 全球购物
自我评价中英文语句
2013/11/30 职场文书
个人实习生的自我评价
2014/02/16 职场文书
工程师岗位职责规定
2014/02/26 职场文书
快递员岗位职责
2014/09/12 职场文书
校长一岗双责责任书
2015/05/09 职场文书
Java中多线程下载图片并压缩能提高效率吗
2021/07/01 Java/Android