情景:

列表页跳转详情页,需要把列表页的数据带到详情页直接展示,思路是在路径后面加?传参,然后再在详情页获取url的参数。

为了以防中文乱码什么的所以先试用encodeURI转码再decodeURI解码,解码之后再JSON.parse()转成obj。

列表页代码:

var param = JSON.stringify(obj.data);
var info = encodeURI(encodeURI(param))
var url = 'matter/faultReport/faultReportDetail?info='+info ;

详情页代码

var info = GetQueryString('info');
info = (function(info){return JSON.parse(decodeURI(decodeURI(info)))})(info); /*
* 获取地址栏参数
*/
function GetQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r != null) return unescape(r[2]);
return null;
}

  好了,接下来就要说说我遇上的坑了,没错,详情页JSON.parse()报错了,经过我反复debugger比对,是因为在列表页的obj.data中有一个字段有&符号,而encodeURI()又不转译这个符号,导致在详情页GetQueryString()获取参数的时候数据不完整,所以无法JSON.parse()。

  修改方法其实很简单,把encodeURI() 改成encodeURIComponent()方法就好了,这样所有符号都转译了,当然相应的decodeURL()也要改成decodeURLComponent()。

注:encodeURI 会替换所有的字符,但不包括以下字符,即使它们具有适当的UTF-8转义序列:

保留字符 ; , / ? : @ & = + $
非转义的字符 字母 数字 - _ . ! ~ * ' ( )
数字符号 #

关于encodeURI() 踩的坑的更多相关文章

  1. 从零开始学 Java - Spring 支持 CORS 请求踩的坑

    谁没掉进过几个大坑 记得好久之前,总能时不时在某个地方看到一些标语,往往都是上面一个伟人的头像,然后不管是不是他说的话,下面总是有看起来很政治正确且没卵用的屁话,我活到目前为止,最令我笑的肚子痛得是下 ...

  2. webuploader插件,我踩得坑

    我在目前的公司做的项目要么是原生写法去做项目,要么就是vue+webpack做项目,但是vue这部分只是用了模板template,vue其他的都没用. 有一个项目需要做上传图片的功能,老大扔给我一个插 ...

  3. 谈谈调用腾讯云【OCR-通用印刷体识别】Api踩的坑

    一.写在前面 最近做项目需要用到识别图片中文字的功能,本来用的Tesseract这个写的,不过效果不是很理想. 随后上网搜了一下OCR接口,就准备使用腾讯云.百度的OCR接口试一下效果.不过这个腾讯云 ...

  4. Asp.Net Core中使用Swagger,你不得不踩的坑

    很久不来写blog了,换了新工作后很累,很忙.每天常态化加班到21点,偶尔还会到凌晨,加班很累,但这段时间,也确实学到了不少知识,今天这篇文章和大家分享一下:Asp.Net Core中使用Swagge ...

  5. python绘图踩的坑

    踩的坑 pyecharts安装地图包 pip install echarts-countries-pypkg 报错Unknown or unsupported command 'install' 这可 ...

  6. 使用CCNode作为容器容易踩的坑

    Cocos2dx中CCNode经常作为一个父容器,里面装一些UI控件,最后组成一个复杂的自定义的UI控件,但是在使用别人的自定义控件和自己写自定义问题的时候会踩一些坑. 首先拿到一个自定义的UI控件一 ...

  7. java基础不牢固容易踩的坑

    java基础不牢固容易踩的坑 经过一年java后端代码以及对jdk源码阅读之后的总结,对java中一些基础中的容易忽略的东西写下来,给偏爱技术热爱开源的Coder们分享一下,避免在写代码中误入雷区. ...

  8. Ubuntu中安装FTP 服务器自己踩得坑

    12点多了,擦!做个码农真不容易呀! 系统:Ubuntu16.04 安装:FTP 步骤: 1.不管有没有一上来我先卸载: sudo apt-get purge vsftpd 2.再安装:sudo ap ...

  9. python——pyinstaller踩的坑 UnicodeDecodeError

    程序本身运行没任何毛病,奈何用pyinstaller -w xx.py的时候提示——UnicodeDecodeError: 'ascii' codec can't decode byte 0xb3 i ...

随机推荐

  1. 关于spark与scala版本问题记录

    记录一下版本问题: spark与scala版本对应问题: 1.官网会给出,如下,spark2.3.1默认需要scala2.11版本 2.在maven依赖网中也可以看到,如下 3.关于idea开发版本中 ...

  2. 《Effective C++》结语

    九月的这三周把<Effective C++>重读了一遍,尽量以自己的理解,用最简单的(其实太深入也不会写)的语言把书里面的重点都写了下来. 由于之前找实习占用了大量的时间,写的博客都比较水 ...

  3. Spring boot之配置server信息

    知识点: 1.修改端口号 2.修改context-path 3.其它配置说明 配置端口号: Spring boot 默认端口是8080, 如果想要进行更改的话, 只需要修改applicatoin.pr ...

  4. 四叉树的js实现

    基于 https://gamedevelopment.tutsplus.com/tutorials/quick-tip-use-quadtrees-to-detect-likely-collision ...

  5. Dubbo Configuration

    可配置参数 http://dubbo.apache.org/zh-cn/docs/user/references/xml/introduction.html 与 spring 整合的几种方式 Spri ...

  6. koa2中间键原理

    一.koa2 const http = require('http'); const compose = require('./compose'); class Koa { constructor() ...

  7. 查看进程CPU、内存使用情况

    本文介绍通过ps和top查看进程的cpu.内存等使用情况. 1.ps命令 1.1 概览 ps命令相关参数定义: -e 或者-A,选择所有的进程: -L 显示线程: -o 自定义输出格式: 输出格式: ...

  8. BeanDefinition 解析流程【解析所有配置类】

    BeanDefinition 解析流程 BeanDefinition 解析入口:ConfigurationClassPostProcessor#postProcessBeanDefinitionReg ...

  9. 并查集练习(0743) SWUST OJ

    #include<iostream> #include<cstring> using namespace std; ]; int n,m,l,ci,di; int root(i ...

  10. pycharm修改代码后第一次运行不生效解决

    问题: 用pycharm每次修改代码后第一次运行还是原来的结果,运行第二次的时候才是修改后代码的结果 解决: 每次修改代码后保存一下即可解决