JavaScript重定向URL参数的两种方法小结


Posted in Javascript onOctober 19, 2016

这篇文章主要介绍的是JavaScript重定向URL参数的两种方法,下面话不多说,直接看示例代码。

一、字符拼接形式

function setUri(para, val) {
      var strNewUrl = new String();
      var strUrl = new String();
      var url = window.location.href;
      strUrl = window.location.href;

      if (strUrl.indexOf("?") != -1) {
        strUrl = strUrl.substr(strUrl.indexOf("?") + 1);  //获取参数

        if (strUrl.toLowerCase().indexOf(para.toLowerCase()) == -1) { //如果没有找到参数,则直接赋值
          strNewUrl = url + "&" + para + "=" + val;
          window.location.href = strNewUrl;
        } else {
          var aParam = strUrl.split("&");

          for (var i = 0; i < aParam.length; i++) {
            if (aParam[i].substr(0, aParam[i].indexOf("=")).toLowerCase() == para.toLowerCase()) {
              aParam[i] = aParam[i].substr(0, aParam[i].indexOf("=")) + "=" + val;
            }
          }
          strNewUrl = url.substr(0, url.indexOf("?") + 1) + aParam.join("&");
          window.location.href = strNewUrl;
        }
      } else {
        strUrl += "?" + para + "=" + val;
        window.location.href = strUrl;
      }
    }

二、利用正则

//使用正则
    function setPara(para, val) {
      var newpar = "";
      var url = window.location.href;
      var pars = location.search.substring(1);

      var reg = new RegExp("(^|)" + para + "=([^&]*)(|$)");
      if (reg.test(pars)) {  //有需要的参数para

        var p1 = pars.split(para)[0];  //productID=100857&count=1&
        var p2 = pars.split(para)[1];  //=75825&coupval=1.5&addressID=358&invoiceID=1245&invoiceName=jesse

        if (p2.indexOf("&") > -1) {
          var p3 = p2.split("&")[0];
          if (p3 == "=" + val + "") {
            return false;
          }
          newpar = p1 + para + '=' + val + '&' + (p2.split(p3))[1];
        } else {
          if (p1) {
            newpar = p1 + para + '=' + val;
          } else {
            newpar = para + '=' + val;
          }
        }
      } else {
        if (url.indexOf("?") == -1) {
          newpar = pars +"&"+ para + "=" + val;
        } else {
          newpar = pars + "&" + para + "=" + val;
        }
      }
      window.location.href = location.href.split('?')[0] + "?" + newpar;
    }

 调用:

<script>
window.onload = function () {
      var btn = document.getElementById("btnClick");

      btn.onclick = function () {





// url地址:http://localhost:54714/testuri.aspx?productID=100857&count=1&coupresId=12785&coupval=1.5&openId=12456&addressID=358&invoiceID=&invoiceName=




  //setUri("coupresId", 0);





setPara("coupresId", 0); 


} 

}
</script>

<input type="button" id="btnClick" value="重定义参数" />

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
清除网页历史记录,屏蔽后退按钮!
Dec 22 Javascript
jquery 最简单的属性菜单
Oct 08 Javascript
JQuery 拾色器插件发布-jquery.icolor.js
Oct 20 Javascript
jquery 学习之二 属性相关
Nov 23 Javascript
Ext.get() 和 Ext.query()组合使用实现最灵活的取元素方式
Sep 26 Javascript
文件编码导致jquery失效的解决方法
Jun 26 Javascript
sogou地图API用法实例教程
Sep 11 Javascript
Node连接mysql数据库方法介绍
Feb 07 Javascript
基于Bootstrap的网页设计实例
Mar 01 Javascript
vue2.0结合DataTable插件实现表格动态刷新的方法详解
Mar 17 Javascript
详解用JS添加和删除class类名
Mar 25 Javascript
Vue开发中遇到的跨域问题及解决方法
Feb 11 Javascript
Angular2  NgModule 模块详解
Oct 19 #Javascript
JS自定义函数对web前端上传的文件进行类型大小判断
Oct 19 #Javascript
jQuery  ready方法实现原理详解
Oct 19 #Javascript
Javascript实现汉字和拼音互转的终极方案
Oct 19 #Javascript
Javascript typeof与instanceof的区别
Oct 18 #Javascript
javascript self对象使用详解
Oct 18 #Javascript
jQuery动态添加与删除tr行实例代码
Oct 18 #Javascript
You might like
php的sso单点登录实现方法
2015/01/08 PHP
laravel Model 执行事务的实现
2019/10/10 PHP
jQuery.each()用法分享
2012/07/31 Javascript
onclick与listeners的执行先后问题详细解剖
2013/01/07 Javascript
PHP实现的各种中文编码转换类分享
2015/01/23 Javascript
jquery实现相册一下滑动两次的方法
2015/02/09 Javascript
js省市联动效果完整实例代码
2015/12/09 Javascript
js实现div在页面拖动效果
2016/05/04 Javascript
浅谈js函数的多种定义方法与区别
2016/11/29 Javascript
无法获取隐藏元素宽度和高度的解决方案
2017/03/07 Javascript
vue图片加载与显示默认图片实例代码
2017/03/16 Javascript
BootStrap Table 后台数据绑定、特殊列处理、排序功能
2017/05/27 Javascript
详解如何在你的Vue项目配置vux
2018/06/04 Javascript
深入浅出理解JavaScript闭包的功能与用法
2018/08/01 Javascript
jquery ajax加载数据前台渲染方式 不用for遍历的方法
2018/08/09 jQuery
angular2 ng2-file-upload上传示例代码
2018/08/23 Javascript
JavaScript实现选项卡效果的分析及步骤
2019/04/16 Javascript
redux.js详解及基本使用
2019/05/24 Javascript
layui的布局和表格的渲染以及动态生成表格的方法
2019/09/18 Javascript
webstorm建立vue-cli脚手架的傻瓜式教程
2020/09/22 Javascript
浅析vue中的nextTick
2020/12/28 Vue.js
Python内置函数bin() oct()等实现进制转换
2012/12/30 Python
python构建深度神经网络(DNN)
2018/03/10 Python
pycharm 实现显示project 选项卡的方法
2019/01/17 Python
在Python 中同一个类两个函数间变量的调用方法
2019/01/31 Python
Django数据结果集序列化并展示实现过程
2020/04/22 Python
python将字典内容写入json文件的实例代码
2020/08/12 Python
Python基于pillow库实现生成图片水印
2020/09/14 Python
CSS3 创建网页动画实现弹跳球动效果
2018/10/30 HTML / CSS
大学生应聘自荐信
2013/10/11 职场文书
三八红旗集体先进事迹材料
2014/05/22 职场文书
个人对照检查剖析材料
2014/10/13 职场文书
八项规定自查自纠报告及整改措施
2014/10/26 职场文书
小学推普周活动总结
2015/05/07 职场文书
小数乘法教学反思
2016/02/22 职场文书
Python使用openpyxl模块处理Excel文件
2022/06/05 Python