zoukankan      html  css  js  c++  java
  • 如何获取Iframe的页面控件的值

    有时候我们在页面需要使用iframe的方法来引用另一个页面,虽然个人建议不要使用iframe哈,但是有些时候是没得法了才使用的咯,那么在使用的过程中也会遇到某一些问题,我将自己遇到的问题记录下来方便以后的朋友在遇到了此问题少走弯路!!!

    假如我首页index.hmtl使用了iframe引用了child.html页面代码如下:

    <div>
        <div class="panel panel-default">
           
            <div>
                <div class="panel-body">
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 col-md-2 control-label">地理位置</label>
                        <div class="col-sm-9">
                        <div>
                            <iframe id="ifram1" name="jw_frame" frameborder="0" width="650" height="420"  src="child.html" allowTransparency="true"  style="background-color=transparent"></iframe>
                        </div>
                            <button type="button" class="btn btn-success" onclick="hajw()">使用当前位置</button>
                            <div class="help-block" style="color:red;">注意:地图上选好了地点后上面的按钮必点,否则获取不到地理位置</div>
                            <input type="hidden" name="loca_lng" id="loca_lng" value="{$reply['lng']}">
                            <input type="hidden" name="loca_sp" id="loca_sp"  value="{$reply['sp']}">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    获取child.html页面的值代码:
    <script>
    function hajw()
    {
        var loca= $("#ifram1").contents().find("#lonlat").val();
      alert(loca);
    }
    </script>

    child.html

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    </head>
    <body>
    <form action="" method="get">
     值:
      <input id="lonlat" name="lonlat" type="text" readonly="readonly">
      </div>
    </form>
    获取index.html页面控件的值
    <script type="text/javascript">
    var lng=window.parent.document.getElementById("loca_lng").value;
    var sp=window.parent.document.getElementById("loca_sp").value;
    </script>
  • 相关阅读:
    angular 复选框回选
    $parse
    AngularJS 指令的 Scope (作用域)
    文献解读 (1)
    献给初学者:常用的细胞凋亡检测方法
    KofamKOALA
    Dfam.h5.gz下载
    Augustus-3.3.3安装
    bamtools 2.5.1安装
    R语言从原点开始作图
  • 原文地址:https://www.cnblogs.com/LoveQin/p/5227679.html
Copyright © 2011-2022 走看看