`
ling凌yue月
  • 浏览: 338380 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

jquery获得同源iframe内<body>下标签的值

阅读更多

废话不说,直接上例子:

 

test.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="http://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="http://localhost/test/login.html"></iframe>
	</body>
</html>

 

login.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>
 

 

注意:必须同源

分享到:
评论

相关推荐

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

    总结起来,要使用jQuery获取同源`iframe`内`body`下标签的值,首先需要确保`iframe`与父页面同源,然后可以通过`window.frames`获取`iframe`的`contentWindow`,接着访问其`document`对象,并用jQuery包装,最后使用...

    iframe自适应高度 .txt

    1. **跨域限制**:由于同源策略的限制,如果`&lt;iframe&gt;`中的文档与当前页面不在同一域下,则无法直接访问到`&lt;iframe&gt;`的内容,因此需要确保两者的域名相同或者源文档支持跨域访问。 2. **性能考虑**:频繁调整`...

    javascript跨域的4种方法和原理详解.docx

    JSONP 是一种常用的跨域解决方案,它利用了浏览器对 `&lt;script&gt;` 标签的特殊处理能力。通常情况下,浏览器出于安全考虑,不允许通过 `XMLHttpRequest` 请求不同源的数据,即所谓的“同源策略”。然而,`&lt;script&gt;` ...

    jquery点击按钮隐藏父页和引用页的iframe

    通常,我们会通过在`&lt;head&gt;`标签内添加以下代码来引入`jQuery`: ```html &lt;script src="https://code.jquery.com/jquery-3.6.0.min.js"&gt;&lt;/script&gt; ``` 接下来,假设你有一个`iframe`元素,其`id`为`myIframe`,你...

    Jquery调用iframe父页面中的元素及方法

    &lt;iframe id="iframeid" src="IFrame.aspx"&gt;&lt;/iframe&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; ``` **子页面(IFrame.aspx)**: ```html &lt;%@ Page Language="C#" AutoEventWireup="true" CodeBehind="IFrame.aspx.cs" Inherits=...

    jquery得到iframe src属性值的方法

    在网页开发中,有时我们需要获取`iframe`元素的`src`属性值,特别是在涉及到跨域通信、页面嵌套或者动态加载内容的情况下。`jQuery`是一个非常流行的JavaScript库,提供了便捷的方式来操作DOM元素,包括获取`iframe`...

    JQueryiframe页面操作父页面中的元素与方法(实例讲解)

    &lt;iframe id="iframeid" src="IFrame.aspx"&gt;&lt;/iframe&gt; &lt;/body&gt; &lt;/html&gt; ``` 在这个例子中,父页面定义了一个变量`hello`和一个函数`getHelloWorld`。 **示例2:子页面(IFrame.aspx)** ```html &lt;!DOCTYPE html&gt; ...

    JQUERY设置IFRAME的SRC值的代码

    在网页开发中,有时我们需要动态地更改`&lt;iframe&gt;`...需要注意的是,由于同源策略的限制,只有当主页面与`&lt;iframe&gt;`加载的页面在同一域下时,才能直接操作`&lt;iframe&gt;`的内容。否则,需要考虑使用CORS或其他跨域解决方案。

    JS父页面与子页面相互传值方法

    &lt;title&gt;子页面(iframe)&lt;/title&gt; &lt;script&gt; function readDataFromParent() { var data = parent.document.getElementById('textfield').value; alert(data); } &lt;/script&gt; &lt;body&gt; &lt;form id="form1"&gt; &lt;button ...

    jQuery基于ID调用指定iframe页面内的方法

    注意:由于同源策略的限制,只有当父页面和iframe页面位于同一域下,我们才能直接访问和操作iframe的内容。如果它们位于不同域下,这种跨域操作将受到浏览器的限制。 总结一下,jQuery提供了强大的DOM操作能力,...

    jquery 操作iframe的几种方法总结

    var iframeBody = iframeContent.find("body"); ``` - **修改`iframe`中的元素样式**: ```javascript iframeContent.find("#elemId").css({"property": "value"}); ``` - **替换`iframe`的源地址**: ```...

    iframe 跨域 自动适应高度

    然而,`iframe`在处理跨域内容时,会受到同源策略的限制,导致一些功能无法正常使用,比如获取iframe内的DOM元素或设置其高度。本文将详细讲解如何解决`iframe`跨域问题以及实现自动适应高度的功能。 1. **同源策略...

    HTML5不支持frameset的两种解决方法

    &lt;body&gt; &lt;div class="page"&gt; &lt;div class="header"&gt; &lt;div id="title"&gt; &lt;h1&gt;顶部&lt;/h1&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="MainContainer"&gt; &lt;div class="sidebar"&gt;边栏&lt;/div&gt; &lt;div id="main" class="main"&gt;内容&lt;/div&gt; ...

    PHP下ajax跨域的解决方案之window.name实例分析

    &lt;script type="text/javascript" src="./jquery.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; var ifr = document.getElementById("iframe"); ifr.src = "http://www.b.com/data.html"; if (ifr....

    jQuery取得iframe中元素的常用方法详解

    但如果是同源策略下的`iframe`,则可以正常操作。 以下是一些常见的jQuery方法: 1. **在`iframe`子页面获取父页面元素**: ```javascript $('#objId', parent.document); ``` 这个例子中,`parent.document`...

    js实现跨域的方法实例详解

    `&lt;iframe&gt;`标签也可以用于跨域,通过改变`iframe`的`src`属性,可以加载不同源的页面。然后通过读取`iframe`的内容来获取数据。例如: ```html &lt;body&gt; &lt;div id="show"&gt;&lt;/div&gt; &lt;iframe id="frame" style="display: ...

    解析Jquery取得iframe中元素的几种方法

    - **通过jQuery的find方法**:`$(window.frames["iframeName"].document).find("#testId")`这种方法也是用来查找iframe中的特定元素,其中`"iframeName"`是iframe的name属性值。 ### 示例代码 - **在父窗口操作...

    Jquery取得Iframe中元素的几中方法

    当涉及到在页面中嵌入 iframe (内联框架) 的情况时,jQuery 提供了一些方法来帮助我们方便地访问和操作 iframe 中的元素。本文将详细探讨如何使用 jQuery 在父窗口和 iframe 之间进行交互。 1. **父窗口操作 iframe...

    JS跨域请求解决方案.docx

    2. **资源嵌入**:使用`&lt;link&gt;`、`&lt;script&gt;`、`&lt;img&gt;`、`&lt;frame&gt;`等标签,以及CSS中的`background:url()`、`@font-face()`等引用外部资源。 3. **脚本请求**:JavaScript发起的AJAX请求,以及其他涉及DOM和JS对象的...

Global site tag (gtag.js) - Google Analytics