2011-09-15 5 views
6

여기 내 코드 호출되지 않습니다 :로컬 스토리지 이벤트 핸들러는

<script type="text/javascript"> 
    function getLocalStorage() { 
     try { 
      if (!! window.localStorage) return window.localStorage; 
     } catch(e) { 
      return undefined; 
     } 
    } 

    function getAddEventListener() { 
     try { 
      if(!! window.addEventListener) return window.addEventListener; 
     } catch(e) { 
      return undefined; 
     } 
    } 

    function eventHandler(e) { 
     alert("here we are = " + e.storageArea.traveler); 
    }  

    function testStorage() {  
     var db = getLocalStorage(); 
     var addEL = getAddEventListener(); 

     if(addEL) { 
      addEL('storage', eventHandler, false); 
     } else { 
      alert('This browser does not support event listeners'); 
     } 

     db.setItem('traveler', 'Bill'); 
     db.setItem('destination', 'Ventura'); 
     db.setItem('transportation', 'Airplane'); 

     document.getElementById('results').innerHTML = db.getItem('destination'); 
    } 
</script> 

</head> 

<body onload="testStorage();"> 
    <div id="results"> </div> 
</body> 

</html> 

성공적 results' 요소 '에있는 로컬 스토리지 및 디스플레이 결과에서 항목을 삽입하지만, 이벤트 핸들러가 작동하지 않습니다. 브라우저 창을 새로 고침하고 경고 메시지가 표시되지 않습니다. 왜?

+2

'addEL ('storage', eventHandler, false)'대신'window.addEventListener ('storage', eventHandler, false)'를 사용하면 어떻게됩니까? –

답변

12

저장소 이벤트가 동일한 창/탭에서 작동하지 않기 때문입니다. 그들은 동일한 localStorage을 사용하는 다른 윈도우/탭에서만 해고됩니다. 두 개의 분리 된 탭을 열어 보시고 어떤 데이터를 localStorage에 삽입하십시오.

localStorage 이벤트가 어떻게 작동하는지 설명하는 유사한 question입니다.

관련 문제