0

localStorageを使用しています。私のコードはChromeで完全に機能していますが、IE9とFirefoxでは機能していません。

コードは次のとおりです。

document.addEventListener("DOMContentLoaded", restoreContents, false);
document.getElementsByTagName("body")[0].onclick=function(){saveContents('myList','contentMain', event, this);};

function amIclicked(e, eleObject)
{
    alert("amIClicked");
    e = e || event;
    var target = e.target || e.srcElement;
    alert("target = " + target.id);
    if(target.id=='pageBody' || target.id=='Save')
        return true;
    else
        return false;
}

function saveContents(e, d, eveObj, eleObject) {
    //alert("saveContents");
    if (amIclicked(eveObj, eleObject)) {
        var cacheValue = document.getElementById(e).innerHTML;
        var cacheKey = "key_" + selectedKey;
        var storage = window.localStorage;
        //alert ("cacheKey = " + cacheKey + " ,cacheValue = " + cacheValue); 
        if(typeof(Storage)!=="undifined"){
        localStorage.setItem("cacheKey","cacheValue");
        }
        //alert ("Saved!!"); 
        var dd = document.getElementById(d);
        //document.getElementById("contentMain").style.display == "none";       
        dd.style.display = "none";
    }
}

function restoreContents(e,k) {
    //alert("test");
    if(k.length < 1) { return; }
    var mySavedList = localStorage["key_" + k];

    if (mySavedList != undefined) {
        document.getElementById(e).innerHTML = mySavedList;
    }
}


    <a onclick="ShowContent('contentMain','myList','Sample_1'); return true;" href="#" >Sample 1</a><br/><br/>
    <a onclick="ShowContent('contentMain','myList','Sample_2'); return true;" href="#" >Sample 2</a><br/><br/>

    <div style="display:none;display:none;position:absolute;border-style: solid;background-color: white;padding: 5px;"id="contentMain">
    <ol id="myList" contenteditable="true">
        <li>Enter Content here</li>
    </ol>
<!--<input id="editToggleButton" type="button" value="Edit"/>-->
</div>

Firebugを使用してFirefoxでコードをデバッグしようとすると、別の行でエラーが発生します。私はここで完全に混乱しています:)

エラーが発生するコードは次のとおりです。

function amIclicked(e, eleObject)
{
    alert("amIClicked");
    e = e || event;
    var target = e.target || e.srcElement;
    alert("target = " + target.id);
    if(target.id == 'pageBody' || target.id == 'Save'){
        return true;
    }
    else{
        return false;
    }
}

そして、私がMozillaFirefoxで得ているエラーは次のとおりです。

 target is undefined
[Break On This Error]   

alert("target = " + target.id);

私はでターゲットを宣言しました

<body id="pageBody">

あまりにも混乱している

4

3 に答える 3

3

localstorageが存在するかどうかを確認する方法は少し異例であり、レガシーブラウザにlocalstorageがないことを実際に検出できない場合があります。以下に、このコードに「未定義」などのタイプミスがあります。

var storage = window.localStorage;
//alert ("cacheKey = " + cacheKey + " ,cacheValue = " + cacheValue); 
if(typeof(Storage)!=="undifined"){
    localStorage.setItem("cacheKey","cacheValue");
}

代わりに、localStorageが使用可能かどうかを確認する正しい方法は次のとおりです。

if(window.localStorage) { 
    localStorage.setItem("cacheKey","cacheValue"); 
}

そうは言っても、この場合、それが実際に問題を引き起こしているわけではありません。代わりに、デバッガーが次の行でエラーを検出したことを指摘しました。

if(k.length < 1) { return; }

次のエラーも表示されます。

SCRIPT5007: Unable to get value of the property 'length': object is null or undefined sample_1.html, line 157 character 3

そのエラーメッセージの重要な情報は、オブジェクトがnullであるということです。つまり、パラメータkの引数としてnull値を渡しています。

DOMContentLoadedイベントはこのパラメーターを渡しません。したがって、今のところ、関数内からアクセスできるグローバル変数を使用するのが最も簡単な場合がありrestoreContentsます。

また、@ omriが彼の回答で指摘したように、+ 1ところで、あなたはcacheKeyを、キーを表す実際の変数としてではなく、文字列としてlocalStorageに渡しています。これは正しい使用法です：

localStorage.setItem(cacheKey, cacheValue);

これはコードのすべての問題ではないかもしれませんが、これで始めることができます。これに慣れていないことがわかるので、私が提案できる最も便利なヒントは、これらのブラウザーデバッガーの使用方法を学び、エラーメッセージの意味を認識することです。必要に応じて、エラーメッセージをグーグルで検索してください。これらのツールの使用法を学ぶことができれば、特定の問題を認識し、それらを解決するための計画を立てるのがはるかに簡単になることがわかります。幸運を！:)

于 2012-06-24T20:42:47.747 に答える
2

これはどのブラウザでも機能しますか？！文字列として「cacheValue」があり、typeof Storageが「undifined」（おそらく未定義）と等しくなることはなく、変数selectedKeyが定義されることもありません。

于 2012-06-24T20:44:09.783 に答える
0

私はいくつかのステップを試しました:)ローカルストレージにはhttpが必要ですが、IE9でのみ機能します

しかし、最後にTomcatの助けを借りて、httpを作成しました。そこからlocalstoragehtmlファイルを実行しました。正常に機能していました。

ここで私を支えてくれた人々に感謝します

ありがとうm

于 2012-07-06T12:08:37.190 に答える