1

html5 の localStorage API を使用しています。

シナリオは、ユーザーが「マイリストに追加」ボタンをクリックして、場所の名前をリストに保存できるようにすることです。

次のコードは、Chrome でのみ完全に機能します。1 つのウィンドウに対して機能し、同じソースから 2 つ以上のウィンドウが開いている場合にも機能します。Firefox と IE でウィンドウが 1 つしか開いていない場合は問題なく動作します。複数のウィンドウがある場合、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>
4

1 に答える 1

0

保管イベントはめちゃくちゃです。私はそれでいくつかの作業を行いましたが、物事は一貫していません。Chromeは他のウィンドウでのみイベントを発生させ、Firefoxは変更が発生したウィンドウを含むすべてのウィンドウで発生し、IEは何が問題だったか覚えていません。とにかく、違いを滑らかにするために使用したコードは次のとおりです（これはstore2.jsライブラリのプラグインです）：

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

それが役立つことを願っています。

参考までに、一貫した動作のために、postMessage などを使用してストレージ イベントを偽造することを検討しましたが、アイデアを追跡して、それが本当に実現可能かどうかを確認する時間がありませんでした。

于 2013-10-22T14:52:58.467 に答える