如何将表单放入 iframe 中? visual studio、html
How do you put a form inside an iframe? visual studio, html
所以,我试图让我的表单位于 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>
}
你的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 中,但它似乎不起作用,当我 运行 表单看起来像这样时:
然后,当我填写字段并触发它时,它看起来像这样:
表单现在显示在 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>
}
你的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
属性,因为它不需要知道包含它的框架。