JS动态更新微信浏览器中的title
问题：
最近在做一个微信中分享的宣传页，分不同的场景，切换不同的场景时需要设置不同的title，实现的方案很简单，当用户切换场景的时候，修改document对象的title属性，可是在实际测试中，ios微信确不起作用。
解决思路：
首先怀疑ios微信不支持，document.title修改头部修改，但是我们经过测试，如果页面首次加载直接修改title属性是可以实现的。所以这里原因有可能就是只在页面首次加载时初始化了标题title，之后就没有再监听 window.title的change事件，所以我们这里只需要想办法触发window.title的监听事件。
解决方案：
这里我们采用了hack来解决。当我们修改了title后，立即创建一个请求，加载一个空的iframe，从而触发window.title的监听。然后我们立即移除空请求，保证不会对页面造成影响。
实现代码：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>测试</title>
</head>
<body>
</body>
<script type="text/javascript">
setTimeout(function(){
setTitle('title修改了')
}, 2000); function setTitle(title){
document.title = title || document.title;
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=="micromessenger" && !!ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/i)){
var ifr = document.createElement('iframe')
ifr.src = "/favicon.ico";
ifr.onload = function() {
setTimeout(function(){
ifr.remove();
}, 0)
}
document.body.appendChild(ifr);
}
}
</script>
</html>
JS动态更新微信浏览器中的title的更多相关文章
- JS动态修改微信浏览器中的title
JS动态修改微信浏览器中的title我们的原理是设置一个ifame然后我们再加载一下就可以实现了,具体的例子如下所示． 平时使用JS修改title,直接document.title=新标题就好了 这样 ...
- UEditor js动态创建和textarea中渲染【原】
UEditor动态创建和textarea中渲染 http://ueditor.baidu.com/website/examples/textareaDemo.html <!DOCTYPE> ...
- js判断是否是在微信浏览器中打开
// js判断是否是在微信浏览器中打开 function is_weixn(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/Mi ...
- 在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 部分安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法
前端JS中使用XMLHttpRequest 2上传图片到服务器,PC端和大部分手机上都正常,但在少部分安卓手机上上传失败,服务器上查看图片,显示字节数为0.下面是上传图片的核心代码: HTML < ...
- 使用命令动态更新JAR包中的文件
动态更新JAR包中的文件,经本人实际测试可正常执行! 一.查询jar包中要替换的文件位置 jar -tvf gateway.jar | grep topjui.config.js 二.在当前 ...
- JS判断是否微信浏览器
JS判断是否微信浏览器 function isWeixinBrowser(){ var ua = navigator.userAgent.toLowerCase(); return (/microme ...
- WPF中动态更新TextBlock文字中的超链接，文本
1.------------------------------------------------------------------------- 修改超链接的文本文字: <TextBloc ...
- 解决微信浏览器中无法一键拨号问题tel
公众号中需要在某些页面显示手机号码,并且需要点击后拨号. 原以为 <a href="tel:10086">10086</a> 可以解决了, 没想到在微信浏览 ...
随机推荐
- GITHUB随笔 15-5月 junit
junit 是用来做单元测试的一个工具 测试是一个持续的过程.也就是说测试贯穿与开发的整个过程中,单元测试尤其适合于迭代增量式的开发过程. @ignore: 该元数据标记的测试方法在测试中会被忽 ...
- 【CSAPP笔记】12. 高速缓存存储器
高速缓存存储器 在存储层次结构中,高速缓存存储器,也叫 cache 是最接近 CPU 寄存器的那一块. 更一般而言,缓存(caching)是一个无所不在的技术.缓存的意思是:对于每层的存储设备,位于 ...
- 简单Window下 Android Studio的安装
(1)首先安装JDK 下载JDK 本人觉得官方网站下JDK比较慢,可以直接百度JDK,(如果是64位 百度搜索记得+64位)
- debug阶段贡献分
组名: 新蜂 组长: 武志远 组员: 宫成荣 谢孝淼 杨柳 李峤 项目名称: java俄罗斯方块NEO 发布时间:11.29 武志远 武志远 武志远 武志远 武志远 宫成荣 宫成荣 杨柳 宫成荣 宫成 ...
- PAT 甲级 1141 PAT Ranking of Institutions
https://pintia.cn/problem-sets/994805342720868352/problems/994805344222429184 After each PAT, the PA ...
- jmeter发送json数据，报405、400错误解决方案
1.405错误解决方案:添加HTTP信息头管理器(错误因数:发送格式未设置) 2.400错误解决方案:json文本格式有误(注意:换行.空格等)解决方案:对照json文本数据(错误因数:发送的json ...
- 文件同步工具 lsyncd2.1.6 安装使用问题
项目有文件实时同步备份的需求,做了一下调查,比较好的解决方法是使用lsyncd工具.这里主要记录一下遇到的问题及解决方法. lsyncd 的相关介绍和对比可见: lsyncd实时同步搭建指南——取代r ...
- MT【134】待定系数
已知\(a,b>0\)且\(ab(a+b)=4\),求\(2a+b\)的最小值______. 解答:\(\sqrt{3}(2a+b)\ge(\sqrt{3}+1)a+b+(\sqrt{3}-1) ...
- attention、self-attention、transformer和bert模型基本原理简述笔记
attention 以google神经机器翻译(NMT)为例 无attention: encoder-decoder在无attention机制时,由encoder将输入序列转化为最后一层输出state ...
- Hplsql报错：...HiveSQLExpection:Error while compiling statement:No privilege 'Select' found for inputs {.....}
实践hplsql时,遇到的问题总结一下,若有不对的地方,欢迎交流. 一.Hplsql简介 hplsql的介绍详见:http://lxw1234.com/archives/2015/09/492.htm ...