当提交被点击时存储输入无线电选择

-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(); 
});

来源

2016-04-26 Shniper

您需要将其存储在... localStorage，cookies，数据库...？ – Tuvia

localStorage是我将要使用的，无论谁是downvoting，请解释为什么我可以纠正它。 – Shniper

@Shniper你能告诉你更多的东西吗？ –

也许这会有所帮助。首先，你将不得不把值这些输入

<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; 
});

希望它能帮助:)

来源

2016-04-26 20:11:19

谢谢，这是有帮助的。我想我的主要问题在于当我点击提交时全部发生。我会更新我的问题。 – Shniper

好吧，我会编辑我的答案 –

我编辑了我的问题 – Shniper

我想我会使用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。

来源

2016-04-26 20:13:40 Jacob

当提交被点击时存储输入无线电选择

回答

相关问题