0
在这个HTML中，用户被要求输入个人数据。为了收集它们，我知道我应该使用一个数组并将它们收集在那里。在div内联中，我打算在表格中显示用户的输入。但你怎么做到的？如何在同一页面上显示用户提交的数据
tab=[];
function submitdata(){
\t
}<!DOCTYPE html>
<meta charset=utf-8" />
<title>Form</title>
<link rel="stylesheet" href="http://birdis.notacat.com/css/layout.css" type="text/css" media="screen" />
<link rel="stylesheet" href="http://birdis.notacat.com/css/awwwards.css" type="text/css" media="screen" />
<link rel="stylesheet" href="http://birdis.notacat.com/fancybox/source/jquery.fancybox.css?v=2.0.5" type="text/css" media="screen" />
<script src="http://birdis.notacat.com/js/jquery-1.7.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://birdis.notacat.com/fancybox/source/jquery.fancybox.pack.js?v=2.0.5"></script>
<script type="text/javascript">
\t \t $(document).ready(function() {
\t $(".various").fancybox({
\t \t maxWidth \t : 392,
\t \t maxHeight \t : 580,
\t \t fitToView \t : true,
\t \t padding : 0,
\t \t margin : 0,
\t \t width \t \t : '70%',
\t \t height \t \t : '70%',
\t \t autoSize \t : true,
\t \t closeClick \t : false,
\t \t openEffect \t : 'elastic',
\t \t closeEffect \t : 'elastic'
\t });
});
</script>
</head>
<body>
\t <div id="wrapper">
\t \t <div id="content">
\t \t \t
\t \t \t <h1><img src="Fourth Quarter Project/images/welcome.png" alt="welcome" /></h1>
\t \t \t
\t <form name="PersonalInfo">
\t <p>
\t <br><br>
\t First Name: <input type="text" name="firstNameTextField" placeholder="Your First Name">
\t <br><br>
\t Last Name: <input type="text" name="lastNameTextField" placeholder="Your Last Name">
\t <br>
\t
\t <br>
\t Grade Level:
\t <br><br>
\t <input type="radio" value="A" name="gradeLevel"> Grade 7 <br>
\t <input type="radio" value="B" name="gradeLevel"> Grade 8 <br>
\t <input type="radio" value="C" name="gradeLevel"> Grade 9 <br>
\t <input type="radio" value="D" name="gradeLevel"> 4th Year <br>
\t
\t <br>
\t <br>
\t Section: \t <select name="section">
\t \t \t \t \t <option> Emerald </option>
\t \t \t \t \t <option> Diamond </option>
\t \t \t \t \t <option> Ruby </option>
\t \t \t \t \t <option> Camia </option>
\t \t \t \t \t <option> Jasmin </option>
\t \t \t \t \t <option> Sampaguita </option>
\t \t \t \t \t <option> Potassium </option>
\t \t \t \t \t <option> Rubidium </option>
\t \t \t \t \t <option> Sodium </option>
\t \t \t \t \t <option> Electron </option>
\t \t \t \t \t <option> Neutron </option>
\t \t \t \t \t <option> Proton </option>
\t \t \t \t </select>
\t
\t <br><br>
\t \t Date of Birth: \t <input type="text" name="month" placeholder="mm" size=1 maxlength="2">/
\t \t \t \t \t \t <input type="text" name="day" placeholder="dd" size=1 maxlength="2">/
\t \t \t \t \t \t <input type="text" name="year" placeholder="yyyy" size=1 maxlength="4">
\t \t \t \t \t \t
\t \t <br><br>
\t \t
\t \t Contact Number: <input type="text" name="contactNumberTextField" placeholder="Your Contact Number">
\t \t
\t \t <br><br>
\t \t
\t \t Address:
\t \t <br><textarea name="address" rows=3 cols=30> </textarea>
\t </p>
\t <br>
\t </form>
\t \t \t
\t \t \t \t <div id="blackbox">
\t \t \t \t <input type="submit"> Submit </input>
\t \t \t \t </div>
\t \t \t \t
\t \t \t \t
\t \t \t \t <div id="blackbox">
\t \t \t \t <a class="various" href="#inline">Display</a>
\t \t \t \t </div>
\t \t \t \t
\t \t \t \t <button onClick=submitData()> Submit </button>
\t \t \t \t <button onClick=displayData(submitData())> Display </button>
\t \t \t \t
\t \t \t \t
\t \t </div>
\t \t
\t \t
\t </div>
\t
\t <div id="inline" style="width: 386px; display: none;">
\t \t <span class="inspiration">Your Personal Information</span>
\t \t <p>Angela Mae</p>
\t \t <div class="right">- <span class="red"></span></div>
\t \t <div class="visitbox">
\t \t <h2><a href="" ></a></h2>
\t \t <span class="count"><span class="tenpix"></span></span>
\t \t </div>
\t \t <p><br/>
\t \t \t <span class="cursive"><a href="">#kakuri</a>, <a href="">#wat<a>,</p>
\t \t <p><span class="tenpix"></span></p>
\t \t
\t \t <p><a href="" ></a> <span class="orjust"></span> <span class="send"><a href="" ></a></span></p>
\t </div>
\t
\t <script>
\t \t
\t \t var tab=[];
\t \t
\t \t function submitData(){
\t \t \t tab.push(document.forms["PersonalInfo"][firstNameTextField]);
\t \t \t return tab[];
\t \t }
\t
\t \t function displayData(t){
\t \t \t alert t;
\t \t }
\t </script>
</body>
</html>