js 和 JQuery 获取iframe的父子值
在父窗口中获取iframe中的元素 1、 格式:window.frames["iframe的name值"].document.getElementByIdx_x("iframe中控件的ID").click(); 实例:window.frames["ifm"].document.getElementByIdx_x("btnOk").click(); 2、 格式: var obj=document.getElementByIdx_x("iframe的name").contentWindow; var ifmObj=obj.document.getElementByIdx_x("iframe中控件的ID"); ifmObj.click(); 实例: var obj=document.getElementByIdx_x("ifm").contentWindow; var ifmObj=obj.document.getElementByIdx_x("btnOk"); ifmObj.click(); 在iframe中获取父窗口的元素 格式:window.parent.document.getElementByIdx_x("父窗口的元素ID").click(); 实例:window.parent.document.getElementByIdx_x("btnOk").click(); jquery 在父窗口中获取iframe中的元素 1、 格式:$("#iframe的ID").contents().find("#iframe中的控件ID").click();//jquery 方法1 实例:$("#ifm").contents().find("#btnOk").click();//jquery 方法1 2、 格式:$("#iframe中的控件ID",document.frames("frame的name").document).click();//jquery 方法2 实例:$("#btnOk",document.frames("ifm").document).click();//jquery 方法2 在iframe中获取父窗口的元素 格式:$('#父窗口中的元素ID', parent.document).click(); 实例:$('#btnOk', parent.document).click();
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Insert title here</title> <script type="text/javascript" src="../parenttest/js/jquery-1.6.2.min.js"></script> <script type="text/javascript"> $(function(){ $("#btn2").click(function(){ var value = $("#tt",document.frames("subFrame").document).val(); alert(value); }); }); </script> </head> <body> <form id="form1" name="form1"> <input id="n1" type="text" name="n1" value="aa"/> <input id="btn2" type="button" value="btn2" /> <iframe id = "subFrame" name="subFrame" src="sub.jsp"></iframe> </form> </body> </html>
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Insert title here</title> <script type="text/javascript" src="../parenttest/js/jquery-1.6.2.min.js"></script> <script type="text/javascript"> $(function(){ $(":button").click(function(){ //var value = window.parent.document.form1.innerHTML; //var value = window.parent.document.form1.n1.value; //var value = $("parent #n1").val(); var value = $("#n1",parent.document).val(); alert(value); }); }); </script> </head> <body> <form action=""> <input id="tt" type="button" value="submit" /> </form> </body> </html>