设为首页收藏本站
切换到窄版

鱼C论坛

 找回密码
 立即注册
鱼C论坛»论坛 › 编程语言专区 › Web开发 › js如何操作iframe
返回列表 发新帖
查看: 5381|回复: 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.         }

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


最佳答案
月排行榜 / 总排行榜
alltolove
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.         }

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

最佳答案

alltolove

查看完整内容

哎！操作这个很少有人用的，因为可以调用别人网页的资源，所以是只读的，我给你重写你的index.html的代码吧
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

alltolove
发表于 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.         }

  21.             function abc(){
  22.                 var obj2 = document.getElementById("kk")
  23.                 obj2.type="text"
  24.             }
  25.         </script>
  26.     </body>
  27. </html>
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

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

value是属性值，要用：
  1. var para = document.getElementById("kw").getAttribute("value");
复制代码
小甲鱼最新课程 -> https://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.         }

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


是这样吗？我试了几遍还是不行，浏览器是火狐和IE，都不行！再帮个忙，谢谢！
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

alltolove
发表于 2017-6-11 12:53:53 | 显示全部楼层
你在主文件的head标签里加这么一行
  1. <meta charset="utf-8">
复制代码
小甲鱼最新课程 -> https://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.         }

  21.             function abc(){
  22.                 var obj2 = document.getElementById("kk")
  23.                 obj2.type="text"
  24.             }
  25.         </script>
  26.     </body>
  27. </html>
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

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


这位可爱的鱼油，你的ID不对，怎么能找到DOM
  1. var para = document.getElementById("kk").getAttribute("value");
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

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

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

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

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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

GMT+8, 2025-5-6 01:46

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

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