セーブボタンなしでユーザーのテキスト入力を取得して保存する

Question

これはWebアプリケーションです。 Textareaボックスのユーザータイプ情報。 情報はlocalStorageに格納されます。 現在、ユーザーは情報を保持するために「OK」ボタンをクリックする必要があります。 情報が自動的に保存されることを希望します。

これを行う適切な方法は何ですか？

Answer 1

あなたはlocalstorageにデータを保存することを意味しますか？そうだとしたら、テキストエリアのすべてのキー入力時にローカルストレージの内容を更新することができます。 jQueryのなし

例

$("#myTextarea").keypress(function(){ 
    window.localStorage.setItem("textAreaContent", $(this).val()); 
}); 

Answer 2

、更新、我々はブラウザのテキストの変更がすべて（あるいはほとんど）のために捕獲されていることを確認する必要があるので、我々はtextarea要素に複数のリスナーを添付することができますテキストが変更されるたびにローカルストレージに保存されます。 textInput eventでkeydown, keypress, keyupと例を参照して、キャプチャの変更、イベントに関する

function onTextChange(obj) { 
    var elem = obj.target; 

    // If text has changed, update local-storage and save the saved 
    // value with the element for later checking w/o having to read 
    // from local-storage. 
    if (elem.old_value !== elem.value) { 
     elem.old_value = elem.value; 
     window.localStorage.setItem("textEntry", elem.value); 
     console.log('saved',elem.value); 
    } 
    return false; 
} // onTextChange() 

var elem=document.getElementById('textinput'); 
if (elem.addEventListener){ 
    elem.addEventListener('input',onTextChange.bind(elem),false) 
    elem.addEventListener('keyup',onTextChange.bind(elem),false) 
    elem.addEventListener('change',onTextChange.bind(elem),false) 
} 
else if (elem.attachEvent) { 
    elem.attachEvent('onpropertychange', onTextChange.bind(elem)) 
} 

詳しい情報。