首页 > 代码库 > ios如何动态改变title

ios如何动态改变title

刚刚用vue发现document.title=title在ios上并不能动态改变title(iphone上的微信端),但是在电脑上和安卓手机上却没有问题,仔细查了一下原来是ios存在title不刷新的问题基本的解决方法是:

基于:jquery

var $body = $(body)
document.title = ‘title’
var $iframe = $(<iframe src="http://www.mamicode.com/favicon.ico"></iframe>).on(load, function() {
  setTimeout(function() {
    $iframe.off(load).remove()
  }, 0)
}).appendTo($body)

原生js:

var body = document.getElementsByTagName(body)[0];
        document.title = title;
        var iframe = document.createElement("iframe");
        iframe.style.display="none";
        iframe.setAttribute("src", "http://named.cn/page/take/img/icon_phone.png");
        var d = function() {
          setTimeout(function() {
            iframe.removeEventListener(load, d);
            document.body.removeChild(iframe);
          }, 0);
        };
        iframe.addEventListener(load, d);
        document.body.appendChild(iframe);

这样我们就解决了ios中title不刷新的问题,我们其实就是新建了一个iframe元素,通过hack的方式来刷新title。

其实ios和安卓上还有很多大大小小的bug,对于移动端研究了一番,比如说在用zepto的时候存在的tap失效问题,ios上的tap失效其实很鬼畜,具体解决方法:

cursor:pointer;

只需要给绑定的元素添加这行变小手的代码tap在ios上失效问题就解决了。

在其次就是移动端的点击穿透问题,当一个页面和另一个页面的两个点击链接重合时候,有可能点击第一个页面到第二个页面之后又自动点击,解决的方法就是在点击之后跳转之前取消了当前点击事件,是不是很鬼畜呢?

ios如何动态改变title