如何正确地将动态输入字段传递到另一个页面进行显示
How to properly pass dynamic input fields to another page for display?
所以我有"添加"answers"删除"按钮，它们将分别添加/删除输入字段。我还有一个"预览"按钮（使用锚标记），可以将用户发送到下一页。点击预览按钮后，我想收集所有给出的信息，并在下一页上重新显示。
我完全不知道如何收集这些动态信息（用户会在点击预览之前添加/删除，因此输入量未知）。我怎么能通过这一切？
以下是我的代码/标记的样子（很抱歉，如果代码行太多，我只想给你尽可能多的信息）：
用于删除和添加字段的JavaScript：
<script>
$(document).ready(function() {
$(".add").on('click', function() {
var linehtml = $('.line').html();
var total = $('.line').length;
var dele = (total - 1);
$('#linecont').append('<div class="line"><hr />'+linehtml+'</div>');
return false;
});
$(".del").on('click', function() {
var linecont = $("#linecont");
var total = linecont.find('.line').length;
var dele = (total - 1);
if(total === 1) {
return false;
}
$('.line').eq(dele).remove();
return false;
});
});
</script>
HTML:
<div align="center">
<a href="#" class="button add">Add Line</a>
<a href="#" class="button del">Delete Line</a>
<div style="width: 40%; margin:0 auto">
<label>Campaign Name</label>
<input type="text" placeholder="Campaign Name:" />
</div>
</div>
<div id="linecont">
<div class="line">
<div class="row">
<div class="large-6 columns">
<label>Status:</label>
<select>
<option value="New">New</option>
<option value="Changed">Changed</option>
</select>
<label>Product:</label>
<select>
<option value="Mobile">Mobile</option>
<option value="Social">Social</option>
<option value="Online">Social</option>
</select>
<label>Model:</label>
<select>
<option value="CPC">CPC</option>
<option value="CPI">CPI</option>
<option value="CPM">CPM</option>
<option value="CPA">CPA</option>
<option value="CPD">CPD</option>
</select>
<label>Unit Rate:</label>
<input type="text" placeholder="Just type amount">
</div>
<div class="large-6 columns">
<label>URL Link:</label>
<input type="text" placeholder="URL Link" />
<label>Targeting Info:</label>
<input type="text" placeholder="Target Info">
<label>Total Budget:</label>
<input type="text" placeholder="Total Budget">
<label>Daily Budget:</label>
<input type="text" placeholder="Daily Budget">
</div>
</div>
<div style="width: 40%; margin:0 auto">
<label>Total Units:</label>
<input type="text" placeholder="Total Units">
</div>
<div class="row">
<div class="small-2 columns">
<label>Start Month:</label>
<select>
<option value="Jan">Jan</option>
<option value="Feb">Feb</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="Aug">Aug</option>
<option value="Sept">Sept</option>
<option value="Oct">Oct</option>
<option value="Nov">Nov</option>
<option value="Dec">Dec</option>
</select>
</div>
<div class="small-2 columns">
<label>Day:</label>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="2">3</option>
<option value="3">4</option>
<option value="4">5</option>
<option value="4">6</option>
<option value="5">7</option>
<option value="6">8</option>
<option value="7">9</option>
<option value="8">10</option>
<option value="9">11</option>
<option value="11">12</option>
<option value="12">13</option>
<option value="13">14</option>
<option value="14">15</option>
<option value="15">16</option>
<option value="16">17</option>
<option value="17">18</option>
<option value="18">19</option>
<option value="19">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
</div>
<div class="small-2 columns">
<label>Year:</label>
<input type="text" placeholder="Type in Year" />
</div>
<div class="small-2 columns">
<label>End Month:</label>
<select>
<option value="Jan">Jan</option>
<option value="Feb">Feb</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="Aug">Aug</option>
<option value="Sept">Sept</option>
<option value="Oct">Oct</option>
<option value="Nov">Nov</option>
<option value="Dec">Dec</option>
</select>
</div>
<div class="small-2 columns">
<label>Day:</label>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="2">3</option>
<option value="3">4</option>
<option value="4">5</option>
<option value="4">6</option>
<option value="5">7</option>
<option value="6">8</option>
<option value="7">9</option>
<option value="8">10</option>
<option value="9">11</option>
<option value="11">12</option>
<option value="12">13</option>
<option value="13">14</option>
<option value="14">15</option>
<option value="15">16</option>
<option value="16">17</option>
<option value="17">18</option>
<option value="18">19</option>
<option value="19">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
</div>
<div class="small-2 columns">
<label>Year:</label>
<input type="text" placeholder="Type in Year" />
</div>
</div>
</div>
</div>
<hr>
<div class="panel" style="width:98%; margin:0 auto">
<h5>Terms and Conditions</h5>
<p>I.</p>
<p>II.</p>
<p>III.</p>
<p>IV.</p>
</div>
<hr>
<div align="center">
<a href="io.php" class="button">Preview</a>
</div>
如果信息不需要安全，只需使用url传递参数：如何从get参数中获取值？
1） 在onclick函数中，收集信息并创建一个字符串，该字符串将成为新的url（带有参数）2） 使用window.location = newUrl;访问链接3） 在新页面中，解析URL以获取信息
您可以使用localStorage变量在页面之间传递值例如，第1页：localStorage.setItem（"key"、"value"）；第2页：var value=localStorage.getItem（"key"）；
相关文章：
- bootstrap消除模态并显示另一个模态
- 如何使用JS/jQuery在另一个网站上显示iframe中的特定内容
- 如何在单击按钮时显示一个分区，同时隐藏另一个分区
- PHP处理来自一个页面的http请求，并将其显示在另一个页面上
- 如果显示另一个折叠的图元，如何隐藏该图元
- Javascript:当这个单词被点击5次时，下面会显示另一个单词
- 使用javascript加载并显示来自另一个域的页面，而不显示原始URL
- 当我将子项从一个父项移动/复制到另一个父级时，如何重新计算显示
- 如何将src的值放在一个输入中，然后在另一个页面上显示它
- 必应地图没有'当我向函数添加另一个参数时，t显示
- notify.js没有'如果另一个窗口被聚焦，则不显示通知
- 是否可以使用不同投影的另一个WMS层显示OSM数据
- 如何在显示多个标记时单击另一个标记时关闭信息窗口
- 下载网站'的内容并在另一个网站中显示(部分）
- 显示/隐藏下拉选项取决于另一个下拉选择
- 检查资源的id是否在ng重复中显示的另一个资源的id列表中
- 在另一个文件夹中显示React组件
- 在重定向到 ASP.NET C# 中的另一个页面之前显示客户端脚本警报
- 当另一个显示时加载HTML而不修改他
- 将imsg src从一个更改为另一个显示'轻弹'
