万年素人からHackerへの道

万年素人がHackerになれるまで殴り書きするぜ。

  • ・資産運用おすすめ
    10万円は1000円くらい利益
    資産運用ブログ アセマネ
    • ・寄付お願いします
      YENTEN:YYzNPzdsZWqr5THWAdMrKDj7GT8ietDc2W
      BitZenny:ZfpUbVya8MWQkjjGJMjA7P9pPkqaLnwPWH
      c0ban:8KG95GXdEquNpPW8xJAJf7nn5kbimQ5wj1
      Skycoin:KMqcn7x8REwwzMHPi9fV9fbNwdofYAWKRo

    iOSのMobile Safariでのブラウザバック問題

    iPhoneでのMobile Safariのloadイベントについて、
     iPhoneではブラウザバックによって戻って来たページではloadイベントを行ってくれません!

    Aページ→Bページで、Bページから戻ったAページでloadしてくれない!

    window.addEventListener('load', function(){
        var element = document.getElementById("hoge");
        element.addEventListener('click', function(event){
        }
    }
    


    ■その1:setIntervalを使用する
    →ブラウザバックしても生きているsetIntervalを使用する方法が考えられる
    ×しかし、複数のオブジェクトが作成されてしまう。

    window.addEventListener('load', function(){
        var element = document.getElementById("hoge");
        setInterval(function() {
        element.addEventListener('click', function(event){
        }
        , false) }, 1000);
    }
    

    →ちなみにAddEventlistenerのことについてここに書いてます。
    Document Object Model Events

    If multiple identical EventListeners are registered on the same EventTarget with the same parameters the duplicate instances are discarded. They do not cause the EventListener to be called twice and since they are discarded they do not need to be removed with the removeEventListener method.

    「they are discarded 」というのがメモリに蓄積せずに廃棄するのか、単に実行されないことをdiscardといってるのがわかりません。
    iPhonesafari自体が正しく実装してるかもわかりません。

    しかも、Mobile SafariではsetTimeoutやsetIntervalで回すループは一定の時間が経過すると止まる仕様らしい?
    バージョンを負うごとに緩和されてるが、再帰的にイベントをaddする方法は使えないかも?

    ■その2:pageshowというイベント
    →Mobile Safariで使えるイベントである
    ×しかし、ブラウザバックでは実行されたりされなかったり・・

    window.addEventListener('pageshow', function(){
        var element = document.getElementById("hoge");
        element.addEventListener('click', function(event){
        }
    }
    

    ↓Mobile Safariで使えるイベントのリファレンス
    Safari Web Content Guide

    ■その3:HTMLに直書き!
    →HMTLならかっこわるいけどいけるかも?function(event){}をhogeFunc()にしてみて以下のようにやる
    ×しかし、loadと同じ効果なのか、ブラウザバックには無駄だった。

    <div id="hoge" onclick="hogeFunc(); return false;">
    


    ■その4:Functionを使わない
    →その1で試した方法のFunctionオブジェクトを別の関数にしてやる

    window.addEventListener('load', function(){
        var onClick(event) {
        }
    
        var element = document.getElementById("hoge");
        setInterval(function() {
        element.addEventListener('click', onClick, false) }, 1000);
    }
    

    これならFunctionオブジェクトを生成され続けていかないので、OKっぽい。
    Safariのデバッガでも特に追加され続けていたりはなかった。


    ■おまけ
    load : サーバーから読み込みが完了した直後
    pageshow : ページがレンダリング完了した直後(load直後はもちろん、ブラウザバックによっても)