How to get a variable with multiple form inputs

I just started learning jQuery and I got stuck on something. I have a form which ask for a name, adress, email and phonenumber. Now I wou开发者_高级运维ld like to get all this info in just 1 variable when the submitbutton is pressed. Then I would like to show this variable in the next tab.

Can someone help me out?

---

Does the format matter? If not, this will get you the serialized form:

var value = JSON.stringify($('form').serializeArray());
alert(value);

Then you can pass around value however you like.

UPDATE

If you want something more user friendly you could try something like this. Since you havent provided your HTML, I'm making up a form.

<input id="fullname" type="text" />
<input id="email" type="text" />
<input id="phone" type="text" />
<input id="submitButton" type="button" />

<div id="results"></div>

And the jQuery would be something like:

$('#submitButton').click(function()
{
    var value = $('#fullname').val() + '<br/>' + $('#email').val() + 
                '<br/>' + $('#phone').val();

    $('#results').text(value);

});

UPDATE 2 If you are having trouble with the event handlers, you might want to try to stop the bubbling of the event. by adding the event parameter to the function and calling event.preventDefault()

$('#submitButton').click(function(event)
{
    //do stuff
    event.preventDefault();
});

---

HTML

<form>
    <input type="text" id="txtfirstname"/>
    <input type="text" id="txtlastname"/>
    <a href="#" id="submitForm">Submit</a>
</form>

javascript

$(function(){

     var person = new Object();

     $('#submitForm').click(function(event){

         person = new Object();
         person.FirstName = $('#txtfirstname').val();
         person.LastName = $('#txtlastname').val();
         //....

         //hide current tab.

         //initialize next tab with properties of person.

     });
})