<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<style>body{padding-top:50px;}.starter-template{padding:40px 15px;text-align:center;}</style>
<link rel="stylesheet" type="text/css" href="createdesign.css">
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="Newsfeed.html">NPSS Announcements</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="Newsfeed.html">Newsfeed</a></li>
<li><a href="Create.html">Create</a></li>
<li><a href="Calender.html">Calender</a></li>
<li><a href="login.html">Logout</a></li>
</ul>
</div><!--.nav-collapse -->
</div>
</nav>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<h1>Create A New Announcement</h1>
<form action="action_page.php">
Announcement Title: <input type="text" name="ATitle" size="50">
<br>
Descritption:<br>
<br>
<input type="radio" name="sex" value="male" checked>Male
<input type="radio" name="sex" value="female" checked>Female
<br>
When is the Meeting?<input type="datetime-local" name="Awhen" </input>
<br>
Where is the Meeting<input type="text" name="Awhere"></input>
</form>
</body>
</html>
我试图将 中的所有信息（例如公告标题、描述、性别和时间）放入一个数组（JS）中，以便稍后检索它们并在其他位置显示信息。我是一名初学者程序员，所以请解释一下！我很感谢您的帮助！
您需要了解的基础是您可以访问这些元素并获取它们的值。然后你可以将它们放入一个数组中。以下是如何获取单个元素的值并将其放入数组中。
var myFormData = []; //declare an array
var value1 = document.getElementById("myTextInput").value; //get the value of an element by it's id
myFormData.push(value1); //put to the array
接下来，有一些快捷方式可以同时对多个元素执行此操作。
您可以向所有表单字段添加一些类，例如
myInputs以下是如何按类别选择多个元素。
var myFormInputs = document.getElementsByClassName("myInputs")
现在
myFormInputs您可以在
filtermyFormInputsvar myFormData = Array.prototype.filter.call(myFormInputs, function(anElement) {
return anElement.value;
})
内部函数是按元素调用的 - 所以我们可以返回它的值。现在使用所有这些值创建了
myFormData有很多更短的方法可以做到这一点。您可以使用一些优雅的库（例如 JQuery）来实现快速开发和更短的代码。但以上是所有的构建块。
也不要忘记了解JS对象。
既然你使用的是 jQuery，我就看看
.serialize()https://api.jquery.com/serialize/
或者，您可以构建自己的数组，但我认为由于您是“初学者”，序列化将为您完成所有这些工作。
当您支持 IE10+ 时，您应该真正研究一下 FormData 对象，这确实是很酷的东西。它拥有您错过的所有支持。现在，您可以发送自定义的不存在的表单，而无需使用 jQuery 创建表单，例如：
var form = new FormData();
form.append( 'uploaded_file', $('input[type=file]')[0].files[0] );
form.append( 'description', 'I am a cool file, you know...' );
$.ajax({
url: 'http:/whatev.er/',
type: 'POST',
processData: false,
contentType: false,
dataType: 'json',
success: function(data) {
alert('I just uploaded a file with an AJAX-call so I do not have to refresh the page! Wooo!');
}
});
您可以使用 jQuery 的
.serializeArray()这是将表单数据转换为数组/对象的方法：
$("#formid").serializeArray();
这就是将数据放回表单的方法：
$.each(form_data, function(n, el) {
// n is just a number identifying it
$("#testform input[name='"+el.name+"']").val(el.value);
});