ラジオ入力用のlocalStorage？

Question

次のコードは、ページの更新時にフォーム入力を記憶するために働いています。私は、ラジオボタンの入力を覚えて進める方法を完全には分かっていません。これを行うにはどのようにコードを調整するのですか？

<input type="radio" name="options[Substrate]" id="clear" class="substrate" value="Clear – 125 µm SU320" /> 
<input type="radio" name="options[Substrate]" id="white-50" class="substrate" value="White – 50 µm Melinex 339"/> 


$(document).ready(function() { 

// Save Order on Refresh 
    $(window).unload(saveSettings); 
    loadSettings(); 

}); 


function loadSettings() { 
    $('#circuitsNum').val(localStorage.setcircuit); 
    $('#distanceNum').val(localStorage.setdistance); 
    $('#note').val(localStorage.setnote); 
    $("#metreSelect").val(localStorage.setmetre); 
} 

function saveSettings() { 
    localStorage.setcircuit = $('#circuitsNum').val(); 
    localStorage.setdistance = $('#distanceNum').val(); 
    localStorage.setnote = $('#note').val(); 
    localStorage.setmetre = $("#metreSelect").val(); 
} 

Answer 1

$('radioButton').prop("checked")機能を使用して、ラジオボタンが選択されているかどうかを確認できます。

および$('radioButton').prop("checked", true)ラジオボタンを確認してください。

またあなたがチェックオプションのIDを取得することができますのlocalStorage使用から値を取得するには

localStorage.setItem('item_key', 'item_value'); 

：

$('input[name="options[Substrate]"]:checked').attr('id') 

はlocalStorageを使用して値を設定するには

localStorage.getItem('item_key'); 

だからあなたのコードでそれを使用する：

function saveSettings() { 

    // Setting the ID of the checked button 
    localStorage.setItem('substrateRadioButton', $('input[name="options[Substrate]"]:checked').attr('id')); 

    // or 

    // Setting the state of each button 
    localStorage.setItem('clear', $("#clear").prop("checked")); 
    localStorage.setItem('white-50', $("#white-50").prop("checked")); 
} 

function loadSettings() { 
    // Gettings the ID of the checked button 
    $("#"+localStorage.getItem('substrateRadioButton')).prop("checked", true); 

    // or   

    // Gettings the state of each button 
    $("#clear").prop("checked", localStorage.getItem('clear')); 
    $("#white-50").prop("checked", localStorage.getItem('white-50')); 
} 

あなたは値をif文で設定されているかどうかを確認することができます

var item = localStorage.getItem('item_key'); 

if (item) { 
    // key is set 
} else { 
    // key is not set 
} 

あなたのloadSettings()機能の値の有無をチェックするのが賢明だろう。

続きを読むlocalStoragehereを参照してください。

以上約prop()here。