Question

我正在使用html5的localStorage API。

方案是用户单击“添加到我的列表”按钮，这样她就可以将列表名称保存到列表中。

以下代码仅适用于Chrome。适用于一个窗口，如果两个或多个窗口是从同一个源打开的话。如果在Firefox和IE中只打开一个窗口，则工作正常。如果有多个窗口，在IE中不会获取数据。在Firefox中，如果我点击添加名称，则将其添加约30次。

我试图根据我找到的例子来实现我的代码。

我该如何解决这个问题？

提前致谢。

<input type="button"  value="Add to my list" onClick="savepoi(document.getElementById('name').innerHTML);"/>                                     

<script>

//listen if a storage happened to another window and call the right function
if (window.attachEvent) { // IE8 support
   window.attachEvent('onstorage', storageEvent);} 
else 
{window.addEventListener('storage', storageEvent, true);}

function storageEvent(event) {
//if something is added
   if(event.oldValue==null)
   {savepoib(event.newValue);}
}


function savepoi(a){
  //if no localStorage, set firs key=1, else add 1 to the existing
  //save key and name together
  if(localStorage.length==0)
  {localStorage.setItem(1,1+"-"+a);}
  else
  {localStorage.setItem((localStorage.length+1),(localStorage.length+1)+"-"+a);}

}

function savepoib(a){
  //split to get key and name 
  var b =a.split("-");
  var idi=b[0];//key
  var myname = b[1];//name

  if(localStorage.length==0)
  {localStorage.setItem(1,1+"-"+myname);}
  else
  {localStorage.setItem(idi,idi+"-"+myname);}
}
</script>

Answer 1

存储事件很乱。我已经完成了一些工作，事情并不一致。 Chrome只会在其他窗口中触发事件，Firefox会在所有窗口中触发，包括发生更改的窗口，以及IE，我不记得是什么问题。无论如何，这是我用来消除差异的代码（它是我的store2.js库的插件）：

https://github.com/nbubna/store/blob/master/src/store.bind.js

希望有所帮助。

仅供参考，为了保持一致的行为，我考虑过尝试使用postMessage或类似的东西来伪造存储事件，但我从来没有时间去追查这个想法，看看它是否真的可行。

localStorage无法传输数据，不适用于所有浏览器

1 个答案: