父页面和子页面方法相互调用

直接看代码:

父页面有个div:

<!--打开iframe  -->
<div id="win" >       </div> 

父页面调用方法处理事物

 <a onclick="showWindow('xxx','photosNames','photos','photos_up_file','2')" class="easyui-linkbutton">上传</a>

//方法showWindow()

function showWindow(names,upName,upUrl,upA,upType){
        $('#win').window({   
            width:600,   
            height:350,   
            modal:true,
            closed:true,
            title:names,
            maximizable:false
        }); 
        $("#win").window('open');
    <!-- 给div 赋值html,使其拥有个div-->
        $("#win").html("<iframe id='son' src='upload_child.html' allowTransparency='true' style='border:0;width:98%;height:98%;padding-left:2px;' frameBorder='0'></iframe>");

        assgVal(upName,upUrl,upA,upType);
    }

父页面对子页面的一些 赋值

function assgVal(upName,upUrl,upA,upType){  
        setTimeout(function () { 
                //直接操作子页面属性,给子页面的属性赋值
                $('#son').contents().find("#name").val(upName);
                $('#son').contents().find("#url").val(upUrl);    
                $('#son').contents().find("#a").val(upA);    
                $('#son').contents().find("#type").val(upType); 
        },200);
     } 

upload_child.html 子页面

<input type="hidden" id = "url" />
<input type="hidden" id = "name" />
<input type="hidden" id = "a" />
<input type="hidden" id = "type" value="1"/>

给父对象赋值

function sumValue(names,url){
window.parent.$("#"+fileName+"").val(names);
window.parent.$("#"+fileUrl+"").val(url);

}
在使用iframe时,页面页面传值的方法如下所示:在页面的JS代码中,可以通过postMessage函数向页面发送消息。该函数需要两个参数,即key和value,分别表示字段名和值。首先,通过获取iframe元素,然后使用contentWindow属性获取iframe的contentWindow对象。接着,调用postMessage函数,将要传递的数据以对象的形式传入,对象的key对应字段名,value对应值。具体代码如下所示:postMessage: function (key, value) { let iframe = $('iframe')[0]; if (iframe) { iframe.contentWindow.postMessage({ 'key': key, 'value': value }, iframe.src); } }。这样,页面就能够向页面传递值了。 [2<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [iframe 页面之间传值](https://blog.csdn.net/Caocui_/article/details/122664544)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* [JS页面页面相互传值方法](https://download.csdn.net/download/weixin_38631738/13049741)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值