zoukankan      html  css  js  c++  java
  • 如何在父页面中操作/获取iframe页面中的元素?这个小问题折腾了我快半个小时,所以记下来吧!

    例如父页面代码如下:

    <div class="container-fluid" style="background-color: #eee;">
            <div class="row-fluid">
                <div class="span12">
                    <div class="shadowbg panel-wrapper">
                        <div class="shadowbg-1">
                            <div class="shadowbg-2">
                                <div class="panel" style="height:370px;">
                                    <div class="panel-header">
                                        <div class="crumbs">                                
                                            <button id="tabName_project" class="tabName" onclick="clickFunction(1)">项目</button>
                                            <button id="tabName_object" class="tabName" onclick="clickFunction(2)">对象</button>
                                            <button id="tabName_task" class="tabName" onclick="clickFunction(3)">任务</button>
                                        </div>
                                    </div>
                                    <iframe id="contentFrame" name="contentFrame" frameborder="0" src=""  scrolling="no" width="100%" height="100%">
                                    </iframe>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    由上代码可知,父页面中包含了一个<iframe>子页面。

    但是需求中需要在父页面操作(获取)iframe页面中的元素(例如修改某个div的样式、获取某个input的值等等)。

    解决的办法如下所示:

    //确认
            function queryInfo(){
                var buttonType = $("#buttonType").val();
                var type = $("#type").val();
                if(type == "projectT"){
                    if(buttonType == "radio"){
                        //获取当前选项的id
                        var rowData =window.frames['contentFrame'].$('#componentTable').jqGrid('getGridParam','selrow');                    
                    }else{
                        //获取多选选项的id数组
                        var rowData = window.frames['contentFrame'].$("#componentTable").jqGrid("getGridParam", "selarrrow");
                    }
                    if (!dataIsExist(rowData)) {
                        alert('请先选择要查询的选项');
                        return;
                    }
                    rowData = rowData + "";
                    $.ajax({
                        type: "post",
                        url: "<c:url value='/ajax'/>",
                        data: {
                            service: "com.shd.biz.commonComponent.demo.service.DemoService",
                            method: "getProjectInfos",
                            params: [rowData]
                        },
                        success:function(data){
                            window.close();
                            returnResult(data.stringValue);
                        },
                        dataType:"json"
                    });
                }
            }

    就这么简单的一句:

    window.frames['IFrameId'].$('#XXXX').val();
  • 相关阅读:
    java语法基础
    向linux内核增加一个系统调用-1
    dp-矩阵连乘
    struct和typedef struct
    Ubuntu安装Chrome及hosts修改
    c++primer-p100.用迭代器进行二分法搜索
    c++primer-p101.ex3.24
    c++ vector用法和迭代器
    Bytes和bits的区别(字节和位的区别)
    基于R语言的数据分析和挖掘方法总结——中位数检验
  • 原文地址:https://www.cnblogs.com/4AMLJW/p/sdoiufosdfojo20200605115311.html
Copyright © 2011-2022 走看看