google翻译引起的乱码bug

4,229 阅读1分钟

1,bug现象

最近在开发过程中,发现,输入框莫名其妙的会有乱码的问题。而且这个乱码问题,偶尔有偶尔没有。

乱码的表现就是数据被很多<font style='vertical-align:inherit'></font>标签包裹。

2.bug分析

我们的数据是从后台拉取的,然后给用户编辑。最开始出现乱码的时候,我一度怀疑是被代码注入了。后来查看后端接口,发现端口返回的数据是正常的,而且是json格式的,这种情况下很难出现代码注入的。

接着我又怀疑是插件的问题,我们使用的jqGrid插件,但是把插件的源代码都翻了一遍,也没在代码里找到font这个标签,所以也敢肯定不是插件引起的。

后来灵光一闪,一百度才发现,应该是google翻译引起的。

3.bug复现

4.解决bug

要解决这个bug就要禁用google翻译,网上已经有方法了。说是要添加meta标签。,

<meta name="google" content="notranslate" />

亲测,mete标签,也许能禁止浏览器自动梵音,但是你要是选择手动翻译(右键-翻译成简体中文)这个方法还不管用,还是会造成乱码。这样子,我们还是不能杜绝客户误操作这种情况。

google了很久,终于找到一个合适的方法。就是在你不能翻译的元素上添加一个class,class名为‘notranslate’。我是直接添加到body上了。亲测有效,即使手动翻译都不会添加乱码了。

<body id="innerBody" class="notranslate">