iframe页面改动parent页面的隐藏input部件value值,不能触发change事件。

Posted Brenda

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了iframe页面改动parent页面的隐藏input部件value值,不能触发change事件。相关的知识,希望对你有一定的参考价值。

实现一个依据iframe页面返回充值卡类型不同,安排不同的input部件。

点击选择弹出一个iframe。点击充值卡数据行。返回1、充值卡类型。2、充值卡id(用的UUID)。3、充值卡号(字符串)。

遇到的问题是当iframe选择充值卡时,无法获取parent页面input部件value值的change事件。

parent页js

$("#id_card_type").change(function(){
//事件无法捕获
});
parent页form

<form id="frm" method="post" action="/bill/recharge/new/">
  <input id="id_card_type" name="card_type" type="hidden" />
  <input id="id_card_id" name="card_id" type="hidden" />
  <label>卡号</label><input id="id_cardno" name="cardno" readonly="True" type="text" />
  <span id="btnSelectCard" >选择</span>
</form>

iframe页js

$(this).children().click(function(){
<span style="white-space:pre">	</span>var cid=$(this).parent('tr').attr('item_id');
	var cn=$(this).parent('tr').children('td').eq(0).html();
	var ct=$(this).parent('tr').attr('item_type');
	$('#id_card_id', window.parent.document).val(cid);
	$('#id_cardno', window.parent.document).val(cn);
	$('#id_card_type', window.parent.document).val(ct);

});


解决例如以下:


iframe页js

$(this).children().click(function(){
  var cid=$(this).parent('tr').attr('item_id');
  var cn=$(this).parent('tr').children('td').eq(0).html();
  var ct=$(this).parent('tr').attr('item_type');
  $('#id_card_id', window.parent.document).val(cid);
  $('#id_cardno', window.parent.document).val(cn);
  $('#id_card_type', window.parent.document).val(ct);
  //$('#id_card_type', window.parent.document).trigger('change'); //无效
  window.parent.$('#id_card_type').trigger('change'); //有效
});


以上是关于iframe页面改动parent页面的隐藏input部件value值,不能触发change事件。的主要内容,如果未能解决你的问题,请参考以下文章

JS跨域访问操作iframe里的dom

jsp中父页面如何调用iframe中的src子页面中的js方法

window.parent 判断是否是被嵌入iframe里面

js 父页面不能调用iframe页面的方法怎么回事?

iframe页面之间元素获取与方法调用

iframe 父页面调用子页面方法