HTML多页表单显示隐藏部分，保留表单数据

HTML multiple page form showing hidding sections preserving form data

本文关键字：表单 保留 数据 显示 页表 HTML 隐藏部      更新时间：2023-09-26

这是我的问题，我想要一个像25页的表单，所以我想避免一个巨大的页面永远滚动。

理想情况下，我希望在运行时加载外部html文件，同时保留表单数据，直到用户提交为止

当用户点击链接时，我制作了一个带有很酷菜单的初始页面，我想用另一个html文件中的内容替换该内容。

我试着使用javascript函数并用iframe替换，但它并没有按照我想要的方式工作。经过足够的调试，我可以让它工作，但似乎必须有更好的方法。。。

由于有时看起来很困难的问题有时用另一种方法会容易得多，所以请启发我。

function ContentMap()
{
    var __contentMap = [];
    var __index = 0;
    this.length  = function()
    {
        return __contentMap.length;
    }
    this.addContentMap = function(htmlContent)
    {
        __contentMap.push(htmlContent);
        __index++;
        console.log(htmlContent["id"]);
    }
    this.getContentMap = function(contentId)
    {
        for(q=0;q<__contentMap.length;q++)
        {
            if(contentId.localeCompare(__contentMap[q].id)==0)
            {
                return _contentMap[q];  
            }
        }
    }
    this.getPreviousMap = function()
    {
        if(this.length()>0&&index>0)
        {
            index--;
            return _contentMap[index];  
        }
        else
        {
            return null;
        }
    }
}
var contentMap = new ContentMap();
function replaceContent(contentId,replacementId)
{
    citem = document.getElementById(contentId);
    for(__i=0;__i<citem.childNodes.length;__i++)
    {
        contentMap.addContentMap(citem.childNodes.item(__i));
        citem.removeChild(citem.childNodes.item(__i));
    }
    iframe = document.createElement("IFRAME");
    iframe.setAttribute("src",replacementId);
    iframe.style.width = document.getElementById(contentId).width;
    iframe.style.height = document.getElementById(contentId).height;
    citem.appendChild(iframe);
}

i am not sure whether this is the solution you need. 
    form1.php
    <html>
    <body>
    <form action="#" method="post">
        This is first form..
        <input type="submit" name="form_2" value="submit form1">
        <?php
        if(isset($_POST['form_2'])) {
            include("form2.html");
        }
        ?>
    </form>
    </body>
    </html>

form2.php

<html>
This is second form.
</html>

这将在同一页面上显示第二个表单，但您必须使用css才能仅显示form2

相关文章：