实现一个依据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事件。》对你有帮助,请点赞、收藏,并留下你的观点哦!