如何将表单放入 iframe 中？ visual studio、html

Question

所以，我试图让我的表单位于 iframe 中，但它似乎不起作用，当我运行表单看起来像这样时：

然后，当我填写字段并触发它时，它看起来像这样：

表单现在显示在 iframe 中，但我从一开始就想在里面，因为当您加载页面时。

这是代码：

<head>
        <title></title>
<script>

    function validateForm() {
        var cel = document.forms["myForm"]["cel"].value;
        var celconf = document.forms["myForm"]["celconf"].value;
        var ocr=document.forms["myForm"]["ocr"].value;
        var ocrconf = document.forms["myForm"]["ocrconf"].value;
        if (cel==""||celconf==""||ocr==""||ocrconf=="") {
            alert("Todos los campos deben ser llenados");

        }

        else  if (cel.length != 10||celconf.length!=10) {

            alert("El numero celular debe de ser de 10 digitos");}

        else if (cel != celconf) {

            alert("Los numeros celulares ingresados no Coinciden");

        }


       else if (ocr.length<10||ocrconf.length<10) {

            alert("El OCR ingresado no tiene la longitud necesaria, ésta debe de ser de 13 o 10 digitos");

       }

       else if (ocr.length > 13 || ocrconf.length > 13) {

           alert("El OCR ingresado no tiene la longitud necesaria, ésta debe de ser de 13 o 10 digitos");
       }

       else if (ocr.length == 11 || ocr.length == 12 || ocrconf == 11 || ocrconf == 12) {

           alert("El OCR ingresado no tiene la longitud necesaria, ésta debe de ser de 13 o 10 digitos");

       }



       else if (ocr != ocrconf) {

           alert("Los OCR ingresados no Coinciden");

       }






    }
</script>
</head>

<body>

<iframe name="myFrame" id="frame1">   </iframe>  
<form name="myForm"  onsubmit="return validateForm()" method="post" target="myFrame">
<b>Celular</b><br /><input type="number" name="cel"><br />
<br /><b>Confirma tu Celular</b><br /> <input type="number" name="celconf"><br />
<br /><b>OCR</b><br /> <input type="number" name="ocr"><br />
<br /><b>Confirma tu OCR</b><br /> <input type="number" name="ocrconf"><br />
<br /><input type="submit" value="Enviar">
</form>
    </body>



    }

Answer 1

你的iframe是空的：

<iframe name="myFrame" id="frame1">   </iframe>

窗体在框架之后，所以窗体显示在框架之后也就不足为奇了。然后由于表单的 target 属性，它会发布到框架中：

<form ... target="myFrame">

由于 iframe 引用了第二个页面，您可能需要在此处创建两个页面。一个只有表格，另一个只有 iframe。然后 iframe 可以简单地引用具有以下形式的页面：

<iframe name="myFrame" id="frame1" src="@Url.Action("actionName", "controllerName")"></iframe>

通过将两者分开，表单只需要关心自己是一个表单并像任何表单一样发布。并且框架只需要关心自己是一个框架并引用要在框架内显示的页面。这两个问题不需要 know/care 相互关注。然后表单不需要 target 属性，因为它不需要知道包含它的框架。

如何将表单放入 iframe 中？ visual studio、html

How do you put a form inside an iframe? visual studio, html

javascript

jquery

html

asp.net-mvc-4

iframe