<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function capturarNombre()
{
// obtenemos e valor por el numero de elemento
var porElementos=window.frames["formExterno"].document.forms["form1"].elements[0].value;
// Obtenemos el valor por el id
var porId=window.frames["formExterno"].document.getElementById("nombre").value;
// Obtenemos el valor por el Nombre
var porNombre=window.frames["formExterno"].document.getElementsByName("nombre")[0].value;
// Obtenemos el valor por el tipo de tag
var porTagName=window.frames["formExterno"].document.getElementsByTagName("input")[0].value;
// Obtenemos el valor por el nombre de la clase
var porClassName=window.frames["formExterno"].document.getElementsByClassName("formulario")[0].value;
document.getElementById("resultado").innerHTML=" \
Por elementos: "+porElementos+" \
<br>Por ID: "+porId+" \
<br>Por Nombre: "+porNombre+" \
<br>Por TagName: "+porTagName+" \
<br>Por ClassName: "+porClassName;
}
function capturarCheckbox()
{
var porElementos=window.frames["formExterno"].document.forms["form1"].elements[1].checked;
var porId=window.frames["formExterno"].document.getElementById("acepto").checked;
var porNombre=window.frames["formExterno"].document.getElementsByName("acepto")[0].checked;
var porTagName=window.frames["formExterno"].document.getElementsByTagName("input")[1].checked;
var porClassName=window.frames["formExterno"].document.getElementsByClassName("formulario_check")[0].checked;
document.getElementById("resultado").innerHTML=" \
Por elementos: "+porElementos+" \
<br>Por ID: "+porId+" \
<br>Por Nombre: "+porNombre+" \
<br>Por TagName: "+porTagName+" \
<br>Por ClassName: "+porClassName;
}
function capturarRadio()
{
var resultado="ninguno";
var porNombre=window.frames["formExterno"].document.getElementsByName("deacuerdo");
for(var i=0;i<porNombre.length;i++)
{
if(porNombre[i].checked)
resultado=porNombre[i].value;
}
document.getElementById("resultado").innerHTML=" \
Por Nombre: "+resultado;
}
function capturarSelect()
{
var porElementos=window.frames["formExterno"].document.forms["form1"].elements[4].value;
var porId=window.frames["formExterno"].document.getElementById("seleccion").value;
var porNombre=window.frames["formExterno"].document.getElementsByName("seleccion")[0].value;
var porTagName=window.frames["formExterno"].document.getElementsByTagName("select")[0].value;
var porClassName=window.frames["formExterno"].document.getElementsByClassName("formulario_select")[0].value;
document.getElementById("resultado").innerHTML=" \
Por elementos: "+porElementos+" \
<br>Por ID: "+porId+" \
<br>Por Nombre: "+porNombre+" \
<br>Por TagName: "+porTagName+" \
<br>Por ClassName: "+porClassName;
}
</script>
<style>
iframe {width:250px;height:150px;}
</style>
</head>
<body>
<h1>Obtener los valores de un formulario que esta incluido en un iframe</h1>
<iframe id="formExterno" name="formExterno" src="js_iframe_form.php"></iframe>
<p>
<input type="button" value="obtener el nombre" onclick="capturarNombre()">
<input type="button" value="obtener el checkbox" onclick="capturarCheckbox()">
<br><input type="button" value="obtener el radio button" onclick="capturarRadio()">
<input type="button" value="obtener el select" onclick="capturarSelect()">
</p>
<div id="resultado"></div>
<p><a href="http://www.lawebdelprogramador.com">http://www.lawebdelprogramador.com</a></p>
</body>
</html>