Question

我正在建立一个进行调查的页面。我有一个HTML页面，其中测量员输入相应问题的问题和选择。该页面包含两个按钮，一个是预览调查，另一个是提交。我想要的是，当用户点击“预览调查”按钮时，应该将用户定向到另一个页面，该页面仅显示测量员输入的问题和选项。我该如何使用此功能？

基本上，它是从HTML表单中提取数据并将其显示在另一个页面中。像这样的东西： http://www.surveymonkey.com/s.aspx?PREVIEW_MODE=DO_NOT_USE_THIS_LINK_FOR_COLLECTION&sm=3sP%2fucxKJsI57gtum0mLXhMpuD4LqWiUaSkI8eVytnk%3d

Answer 1

关于如何在Web上的Web应用程序中处理表单输入，有大量tutorials。只需选择一种可供您选择的编程语言。

Answer 2

您有几个选择：

<强> 1。在叠加对话框中打开预览

您可以使用Jquery UI dialog之类的内容，或Twitter Bootstrap或Wijmo等任何其他库。这样您就不需要直接转到另一个页面而不必使用变量（您需要一些javascript来获取选项并将它们插入对话框中

<强> 2。将表单发布到其他页面

这也很可能需要一些javascript。但是假设你已经以一种形式进行了调查，这将不会那么困难。例如，您可以使用jQuery.serialize()函数序列化表单输入并将其发送到其他页面。您可以构建Ajax / XHR请求，也可以将其直接发送到弹出窗口（当您想要最终提交表单时，需要更改操作类型）。示例here

第3。打开一个弹出窗口，让它直接与它的父窗口对话

使用window.parent属性，您可以与打开弹出窗口的窗口/页面对话。您可以读出属性，例如表单值，并在弹出窗口中使用它们。它的工作方式非常类似：

<强> survey_page.html

<script type="text/javascript">
    var popup = window.open('popup.html', 'width=300, height=200');
    if(window.focus) popup.focus();
    return false;
</script>
<form name="testform" id="testform">  
    <input type="text" name="atextfield" value="" />
</form>
<a href="#" class="popup" onclick="open_popup()">Open popup</a>

<强> popup.html

<script type="text/javascript">
    function alertParentValue() {
        alert(window.opener.document.forms['testform'].atextfield.value);
    }
</script>
<a href="#" onclick="return alertParentValue();">Also click me!</a>

如果您点击打开的弹出式链接，然后点击另一个链接，系统会在文本字段中提醒您填写的值。

最有可能提供其他选项，请选择适合您的选项！

Answer 3

在预览按钮上，您只能使用弹出窗口，因为此页面不会重定向到其他页面

从一个html表单中提取数据并将其显示在另一个页面上

3 个答案: