Question

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

enter image description here

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

enter image description here

表单现在出现在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>

通过将两者分开，形式只需要关注自己作为一种形式并以任何形式发布。并且框架仅需要关注自身作为框架并且指向要在框架内显示的页面。这两个问题不需要彼此了解/关心。然后表单不需要target属性，因为它不需要知道包含它的框架。

如何在iframe中放置表单？视觉工作室，HTML

1 个答案: