JavaScript decodeURI() 函数

简介: JavaScript decodeURI() 函数

定义和用法

decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码。

语法

decodeURI(URIstring)

实际应用的时候

比如我从a页面跳转到b页面,携带时间格式的参数

2021-05-24 14:31:00

到b页面时间参数多了一个%20的问题

就成了这个样子了

2021-05-24%2014:31:00

这样的编码格式

传给后端,往往会出现格式问题,传不了

于是要对其进行处理

这个时候就需要用到decodeURI() 函数了。

例子:

a.html

<!DOCTYPE HTML>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
        <style>
    </style>
    </head>
    <body>
       <button  type="button" class="a">跳转到b界面</button>
    </body>
 <script>
     //底部分类复选框取消和选中触发事件
             $(".a").click(function() {
                 window.location.href = "b.html?username=super&workNumber=M202105241431&type=2&beginTime=2021-05-24 14:31:00&endTime=2021-05-24 14:31:00";
             });
 </script>
</html>

b.html

对获取到的时间参数进行转化一下

<!DOCTYPE HTML>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
        <style>
        </style>
    </head>
    <body>
    </body>
    <script>
        //获取对方传过来的参数
        function jqueryUrl(url) {
            debugger
            //将地址从"?"位置分割成两部分
            var arr = url.split('?');
            //取地址右边参数部分从"&"位置继续分割,成为单独参数列表
            var params = arr[1].split('&'); //得到[a=1,b=2,c=3]
            //定义一个空对象
            var obj = {};
            for (var i = 0; i < params.length; i++) {
                var param = params[i].split('='); //得到[a,1]、[b,2]、[c,3]
                obj[param[0]] = param[1]; //为对象赋值
            }
            return obj;
        }
        // url参数列表      
        var urlParams = jqueryUrl(location.href)
        var beginTime=decodeURI(urlParams.beginTime)
        var endTime=decodeURI(urlParams.endTime)
        console.log("开始时间",beginTime)
        console.log("结束时间",beginTime)
    </script>
</html>

相关文章
|
18天前
|
JavaScript 前端开发
JavaScript 闭包:让你更深入了解函数和作用域
JavaScript 闭包:让你更深入了解函数和作用域
|
4天前
|
JavaScript 前端开发
js中改变this指向、动态指定函数 this 值的方法
js中改变this指向、动态指定函数 this 值的方法
|
10天前
|
JavaScript 前端开发 Java
javascript是弱类型语言,一个函数参数可以接收不同类型的变量作为它的该参数
javascript是弱类型语言,一个函数参数可以接收不同类型的变量作为它的该参数
18 0
|
14天前
|
前端开发 JavaScript
前端 JS 经典:函数管道
前端 JS 经典:函数管道
5 0
|
17天前
|
JavaScript 前端开发 网络架构
函数柯里化:JavaScript中的高级技巧
函数柯里化:JavaScript中的高级技巧
|
18天前
|
JavaScript 前端开发
JavaScript的`apply`方法:函数的“应用”与“调用”
JavaScript的`apply`方法:函数的“应用”与“调用”
|
18天前
|
JavaScript 前端开发
JavaScript的`bind`方法:函数的“复制”与“定制”
JavaScript的`bind`方法:函数的“复制”与“定制”
|
18天前
|
JavaScript 前端开发
JavaScript的`call`方法:实现函数间的调用!
JavaScript的`call`方法:实现函数间的调用!
|
19天前
|
JavaScript 前端开发
在JavaScript中,函数原型(Function Prototype)是一个特殊的对象
【5月更文挑战第11天】JavaScript中的函数原型是一个特殊对象,它为所有函数实例提供共享的方法和属性。每个函数在创建时都有一个`prototype`属性,指向原型对象。利用原型,我们可以向所有实例添加方法和属性,实现继承。例如,我们定义一个`Person`函数,向其原型添加`greet`方法,然后创建实例`john`和`jane`,它们都能调用这个方法。尽管可以直接在原型上添加方法,但推荐在构造函数内部定义以封装数据和逻辑。
22 2
|
19天前
|
前端开发 JavaScript 数据处理
在JavaScript中,异步函数是指什么
【5月更文挑战第9天】JavaScript中的异步函数用于处理非立即完成的操作,如定时器、网络请求等。它们可通过回调函数、Promise或async/await来实现。示例展示了如何使用async/await模拟网络请求:定义异步函数fetchData返回Promise,在另一异步函数processData中使用await等待结果并处理。当fetchData的Promise解析时,data变量接收结果并继续执行后续代码。注意,调用异步函数不会阻塞执行,而是会在适当时间点继续。
17 0