鱼C论坛

 找回密码
 立即注册
查看: 4020|回复: 7

[已解决]js如何操作iframe

[复制链接]
发表于 2017-6-11 07:38:53 | 显示全部楼层 |阅读模式
5鱼币
目的:获取iframe中input的值123

打开 index.html

用js无法操作iframe,求助!



两个网页如下:
index.html
  1. <html>
  2.     <head>
  3.         <title>我的百度</title>
  4.     </head>
  5.     <body>
  6.         <div>
  7.             <input type="button" value="百度" onclick="myFun()">
  8.             <input type="button" id="kk" value="abc" onclick="abc()">
  9.         </div>
  10.         <div name="div2" src="abc.html">
  11.             <iframe src="abc.html" name="fr2" id="ppp"></iframe>
  12.         </div>
  13.         <script>
  14.             function myFun(){
  15.                 //var obj1 = parent.document.getElementById("ppp")
  16.                 var obj1 = document.frames[0].window.getElementById("kw")
  17.                 alert(typeof obj1)
  18.         }

  19.             function abc(){
  20.                 var obj2 = document.getElementById("kk")
  21.                 obj2.type="text"
  22.             }
  23.         </script>
  24.     </body>
  25. </html>
复制代码



iframe中的网页如下
abc.html
  1. <html>
  2.     <head>
  3.         <title>abc</title>
  4.     </head>
  5.     <body>
  6.         <div>
  7.             <input type="text" id="kw" value="123">
  8.             <input type="button" id="a1" value="test" onclick="bu1()">
  9.         </div>
  10.         <script>
  11.             function bu1(){
  12.                 alert("999")
  13.         }
  14.         </script>
  15.     </body>
  16. </html>
复制代码


最佳答案
2017-6-11 07:38:54
哎!操作这个很少有人用的,因为可以调用别人网页的资源,所以是只读的,我给你重写你的index.html的代码吧
  1. <html>
  2.     <head>
  3.         <title>我的百度</title>
  4.         <meta charset="utf-8">
  5.     </head>
  6.     <body>
  7.         <div>
  8.             <input type="button" value="百度" onclick="myFun()">
  9.             <input type="button" id="kk" value="abc" onclick="abc()">
  10.         </div>
  11.         <div name="div2" src="abc.html">
  12.             <iframe src="abc.html" name="fr2" id="ppp"></iframe>
  13.         </div>
  14.         <script>
  15.             function myFun(){
  16.                 var obj1 = document.getElementById("ppp")
  17.                 obj1=obj1.contentWindow.document.getElementById('kw')
  18.                 alert(obj1.value)
  19.         }

  20.             function abc(){
  21.                 var obj2 = document.getElementById("kk")
  22.                 obj2.type="text"
  23.             }
  24.         </script>
  25.     </body>
  26. </html>
复制代码

最佳答案

查看完整内容

哎!操作这个很少有人用的,因为可以调用别人网页的资源,所以是只读的,我给你重写你的index.html的代码吧
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-6-11 07:38:54 | 显示全部楼层    本楼为最佳答案   
哎!操作这个很少有人用的,因为可以调用别人网页的资源,所以是只读的,我给你重写你的index.html的代码吧
  1. <html>
  2.     <head>
  3.         <title>我的百度</title>
  4.         <meta charset="utf-8">
  5.     </head>
  6.     <body>
  7.         <div>
  8.             <input type="button" value="百度" onclick="myFun()">
  9.             <input type="button" id="kk" value="abc" onclick="abc()">
  10.         </div>
  11.         <div name="div2" src="abc.html">
  12.             <iframe src="abc.html" name="fr2" id="ppp"></iframe>
  13.         </div>
  14.         <script>
  15.             function myFun(){
  16.                 var obj1 = document.getElementById("ppp")
  17.                 obj1=obj1.contentWindow.document.getElementById('kw')
  18.                 alert(obj1.value)
  19.         }

  20.             function abc(){
  21.                 var obj2 = document.getElementById("kk")
  22.                 obj2.type="text"
  23.             }
  24.         </script>
  25.     </body>
  26. </html>
复制代码
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-6-11 08:06:56 | 显示全部楼层

value是属性值,要用:
  1. var para = document.getElementById("kw").getAttribute("value");
复制代码
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

 楼主| 发表于 2017-6-11 12:03:31 | 显示全部楼层
不二如是 发表于 2017-6-11 08:06
value是属性值,要用:
  1. <html>
  2.     <head>
  3.         <title>我的百度</title>
  4.     </head>
  5.     <body>
  6.         <div>
  7.             <input type="button" value="百度" onclick="myFun()">
  8.             <input type="button" id="kk" value="abc" onclick="abc()">
  9.         </div>
  10.         <div name="div2" src="abc.html">
  11.             <iframe src="abc.html" name="fr2" id="ppp"></iframe>
  12.         </div>
  13.         <script>
  14.             function myFun(){
  15.                 var para = document.getElementById("kw").getAttribute("value");
  16.                 alert(para)
  17.         }

  18.             function abc(){
  19.                 var obj2 = document.getElementById("kk")
  20.                 obj2.type="text"
  21.             }
  22.         </script>
  23.     </body>
  24. </html>
复制代码


是这样吗?我试了几遍还是不行,浏览器是火狐和IE,都不行!再帮个忙,谢谢!
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-6-11 12:53:53 | 显示全部楼层
你在主文件的head标签里加这么一行
  1. <meta charset="utf-8">
复制代码
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

 楼主| 发表于 2017-6-11 16:13:50 | 显示全部楼层
本帖最后由 轩辕匡华 于 2017-6-11 16:15 编辑

不好意思,可能是我太笨了,点击百度按钮还是一点反应也没有!
  1. <html>
  2.     <head>
  3.         <meta charset="utf-8">
  4.         <title>我的百度</title>
  5.     </head>
  6.     <body>
  7.         <div>
  8.             <input type="button" value="百度" onclick="myFun()">
  9.             <input type="button" id="kk" value="abc" onclick="abc()">
  10.         </div>
  11.         <div name="div2" src="abc.html">
  12.             <iframe src="abc.html" name="fr2" id="ppp"></iframe>
  13.         </div>
  14.         <script>
  15.             function myFun(){
  16.                 //var obj1 = parent.document.getElementById("ppp")
  17.                 var para = document.getElementById("kw").getAttribute("value");
  18.                 alert(typeof para)
  19.         }

  20.             function abc(){
  21.                 var obj2 = document.getElementById("kk")
  22.                 obj2.type="text"
  23.             }
  24.         </script>
  25.     </body>
  26. </html>
复制代码
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-6-11 16:37:30 | 显示全部楼层
轩辕匡华 发表于 2017-6-11 16:13
不好意思,可能是我太笨了,点击百度按钮还是一点反应也没有!


这位可爱的鱼油,你的ID不对,怎么能找到DOM
  1. var para = document.getElementById("kk").getAttribute("value");
复制代码
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

 楼主| 发表于 2017-6-11 18:57:04 | 显示全部楼层
本帖最后由 轩辕匡华 于 2017-6-11 19:11 编辑

感谢大神!
因为开发网页是省局的,单位要获取数据又没办法直接申请数据库的用户名密码,只好出此下策了,非常感谢!

另外:
1,大神提到“调用别人的网页资源,所以是只读的",这个有什么影响吗?也就是说,我无法改变value的值?
我还想获取到节点后,可以批量提交数据的。不好意思,不敢用爬虫等方法,我们都有IP地址的,万一省局说我们干什么坏事,就惨了!只是想利用他们开发好的网站。
再次十二分的感谢!
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-3-29 20:09

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表