如何获取具有多个表单输入的变量

Question

我刚开始学习jQuery，并且遇到了一些问题。我有一个表格要求提供姓名，地址，电子邮件和电话号码。现在我想在按下submitbutton的时候将所有这些信息放在1个变量中。然后我想在下一个标签中显示这个变量。

有人可以帮我吗？

Answer 1

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. 

    }); 
}) 

Answer 2

是否格式回事？如果不是，这将让你的序列化形式：

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

然后你就可以绕过value但是你喜欢。

UPDATE

如果你想要的东西更友好的用户，你可以尝试这样的事情。既然你还没有提供你的HTML，我正在编写一个表单。

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

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

而jQuery的会是这样的：

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

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

}); 

更新2如果您有与事件处理程序的麻烦，你可能想尝试阻止事件的冒泡。通过将event参数的函数和调用event.preventDefault()

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