The implementation of a base on the IFRAME page back to the type of card, different input parts arranged.
Click Select to eject an IFRAME. Click on the prepaid card data line. Return 1, prepaid card type. 2, prepaid Card ID (with UUID). 3, Prepaid card number (string).
The problem is that when an IFRAME selects a prepaid card, it cannot get the change event for the value of the parent page input part.
Parent Page JS
$ ("#id_card_type"). Change (function () {//event cannot be captured});
Parent page 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> card number </label ><input id= "Id_cardno" name= "Cardno" readonly= "True" type= "text"/> <span id= "Btnselectcard" > Selection </span></form>
IFrame Page 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);});
The solutions are for example the following:
IFrame Page 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 '); Invalid window.parent.$ (' #id_card_type '). Trigger (' change ');//valid});
The IFRAME page changes the hidden input part value value of the parent page and cannot trigger the change event.