当前位置: 移动技术网 > IT编程>开发语言>JavaScript > jquery获得同源iframe内body下标签的值的方法教程

jquery获得同源iframe内body下标签的值的方法教程

2019年03月26日  | 移动技术网IT编程  | 我要评论

test.html

html代码

<!doctype html> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
<title>jquery</title> 
<style type="text/css"> 
</style> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function (){ 
$("#show").click(function (){ 
var iframeobj = $(window.frames["iframe_name"].document); 
alert(iframeobj.find("#un").val()); 

}); 

}); 
</script> 
</head> 
<body> 
<input type="button" id="show" value="show" /> 
<iframe id="iframe_id" name="iframe_name" src="https://localhost/test/login.html"></iframe> 
</body> 
</html>

login.html

html代码

<!doctype html> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8"> 
<title>登录页面</title> 
</head> 
<body> 
<form method="post" action="#"> 
用户名:<input id="un" type="text" name="username" value="123d" /> 
密 码:<input type="text" name="password"/> 
<input type="submit" value="提交"> 
</form> 
</body> 
</html>

注意:必须同源

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网