2016-04-26 70 views
-1

我需要在我的js文件中存儲選擇每個無線電廣播名稱的無線電選項以及存儲輸入的用戶名。這裏是我的形式當提交被點擊時存儲輸入無線電選擇

<form id="newPlayer"> 
        Username:<br> 
        <input type="text" name="user"/><br> 
        Please Choose a Class: <br> 
        <input type="radio" name="class"/>Archer 
        <input type="radio" name="class"/>Mage 
        <input type="radio" name="class"/>Warrior 
        <br> 
        Please Choose a Race: <br> 
        <input type="radio" name="race"/>Orc 
        <input type="radio" name="race"/>Elf 
        <input type="radio" name="race"/>Human 
        <input type="radio" name="race"/>Worg 
        <br> 
        <input type="submit" value="Submit"> 
       </form> 

編輯: 當我試圖針對它使我重新加載頁面而不是使形式的點擊功能提交按鈕淡出

var userInput; 
var classInput; 
var raceInput; 

$('input[type=submit]').click(function(){ 
    $('#newPlayer').fadeOut(500); 
    userInput = $('input[name="user"]').val(); 
    classInput = $('input[name="class"]:checked').val(); 
    raceInput = $('input[name="race"]:checked').val(); 
}); 
+0

您需要將其存儲在... localStorage,cookies,數據庫...? – Tuvia

+0

localStorage是我將要使用的,無論誰是downvoting,請解釋爲什麼我可以糾正它。 – Shniper

+0

@Shniper你能告訴你更多的東西嗎? –

回答

2

也許這會有所幫助。首先,你將不得不把值這些輸入

<form id="newPlayer"> 
    Username:<br> 
    <input type="text" name="user"/><br> 
    Please Choose a Class: <br> 
    <input value="archer" type="radio" name="class"/>Archer 
    <input value="mage" type="radio" name="class"/>Mage 
    <input value="warrior" type="radio" name="class"/>Warrior 
    <br> 
    Please Choose a Race: <br> 
    <input value="orc" type="radio" name="race"/>Orc 
    <input value="elf" type="radio" name="race"/>Elf 
    <input value="human" type="radio" name="race"/>Human 
    <input value="worg" type="radio" name="race"/>Worg 
    <br> 
    <input type="submit" value="Submit"> 
</form> 

然後,使用jQuery,一個簡單的.VAL()將做的工作:

var class_val = $('input[name="class"]:checked').val(); 
var race = $('input[name="race"]:checked').val(); 
var user = $('input[name="user"]').val(); 

在此之後,你只需要投入localStorage的

localStorage.setItem('class', class_val); 
localStorage.setItem('race', race); 
localStorage.setItem('user', user); 

要訪問在未來的價值觀,你這樣做

var stored_class = localStorage.getItem('class'); 
var stored_race = localStorage.getItem('race'); 
var stored_user = localStorage.getItem('user'); 

爲了讓事情發生在提交,您添加提交事件的形式,這樣的:

$('form').on('submit', function() { 
    // Get values 
    var class_val = $('input[name="class"]:checked').val(); 
    ... 

    // Store values 
    localStorage.setItem('class', class_val); 
    ... 

    // Avoid form submit 
    return false; 
}); 

希望它能幫助:)

+0

謝謝,這是有幫助的。我想我的主要問題在於當我點擊提交時全部發生。我會更新我的問題。 – Shniper

+0

好吧,我會編輯我的答案 –

+0

我編輯了我的問題 – Shniper

0

我想我會使用localStorage的。 例如:

//Make sure to set the selection variable to a object that contains the selections made by the user. 
function save() { 

    //This will save the current settings as an object to the localStorage. 
    localStorage.selections = JSON.stringify(selections) ; 

} 

function load() { 

    if (!localStorage.selections) { 

     alart("No saves found.") ; 
     return false ; 

    } 

    selections = JSON.parse(localStorage.selections) ; 

} 

瞭解更多關於localStorage的here

相關問題