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改变input的value值不触发onchange事件解决方案 (转)
方法(一)(转载的网络资料) 需要了解的知识 首先,我们需要了解onchange和onpropertychange的不同: IE下,当一个HTML元素的属性改变的时候,都能通过 onprope ...
- file类型input框设置上传相同文件,并都可以触发change事件。
在使用file类型input框是,删除了第一次上传到文件,再次上传相同文件,无法触发change事件,所以在删除的js上添加如下js代码: document.getElementById('fileU ...
- 改变input的值不会触发change事件的解决思路
通常来说,如果我们自己通过 value 改变了 input 元素的值,我们肯定是知道的,但是在某些场景下,页面上有别的逻辑在改变 input 的 value 值,我们可能希望能在这个值发生变化的时候收 ...
- IE10 解决input file 同一文件不触发onchange事件
if (window.ActiveXObject) { var reg = /10\.0/; var str = navigator.userAgent; if (reg.test(str)) { v ...
- js showModalDialog打开新的页面给原页面传值问题
a.html中打开一个新页面b.html,b.html页面给a.html中的input传一个值并将value赋给input框. a.html: <html> <head> ...
- jQuery子页面获取父页面元素并绑定事件
父页面HTML文件: <ul id="faul"> <li class="sonli">子页面列表1</li> <li ...
- onchange监听input值变化及input隐藏后change事件不触发的原因与解决方法(设置readonly后onchange不起作用的解决方案)
转自:https://www.cnblogs.com/white0710/p/7338456.html 1. onchange事件监听input值变化的使用方法: <input id=" ...
- INPUT[type=file]的change事件不触发问题
在网页上要操作文件通常会使用INPUT[type=file]控件,但这个控件的设计很蛋疼.它不像其它编程语言中文件选择后会触发一个事件,只是让上面的文字改变,而这个改变可能会触发change事件而已. ...
- 关于解决JQUERY对INPUT元素Change事件不兼容的问题
最近开发一个项目,需要实现用户在WEB表单里的多个INPUT框中输入数量后,立即自动计算加总各项输入的数量之和,并显示在指定的INPUT框中,这个功能实现的原理是简单的,就是只需要在INPUT的onc ...
随机推荐
- 《作业控制系列》-“linux命令五分钟系列”之十
本原创文章属于<Linux大棚>博客. 博客地址为http://roclinux.cn. 文章作者为roc 希望您能通过捐款的方式支持Linux大棚博客的运行和发展.请见“关于捐款” == ...
- html中的空格可以用什么代替
半角空格用 代替,全角的空格可以直接在网页里生效. 打全角空格的两种方法:1.智能ABC按v1,选择第一个2.按shift+空格切换输入法的“半.全角”状态为全角再按空格
- request 报错The remote server returned an error: (415) Unsupported Media Type.
开发时遇到个问题,程序访问数据库数据,给服务器发送请求时,老是报错,返回的错误页面是: HTTP Status 415 - Unsupported Media Type type Status rep ...
- WIN10 搜索功能无法搜索本地应用
原因是使用360卫士此类软件把windows search 服务给禁掉了. 解决方案很简单,就是把windows search 服务重新设置成自启动,并立刻启动,就ok了. 至于如何打开服务组件,可以 ...
- 如何将eclipse里的项目发布到github
首先,给eclipse安装上EGit 在“Help > Install new software”中添加 http://download.eclipse.org/egit/updates 两个都 ...
- Python--模块微谈
一个.py文件是一个模块,模块里面可以定义很多函数,载入模块就可以使用函数.模块又有python内置模块,又有第三方模块,不同模块里可以有相同的函数名和变量名,模块又可以组织到package里,不同的 ...
- To Build A Dev Env On Linux(Ubuntu)
Step1:System Installing 1)use iso image to Step2:Configuration Step3:Software Installing Step4:Other ...
- 如何编写一个简单的makefile
一个规则的构成 目标:依赖1,依赖2······ 命令 例子: objs := init.o nand.o head.o main.o nand.bin : $(objs) arm-linux-ld ...
- WPF学习笔记-自定义窗口
代码部分 <Style x:Key="for_noresize_window" TargetType="{x:Type Window}"> < ...
- [转]Aggregate tasks i Sharepoint 2013
from http://sharepoint247.com/mysite/aggregate-tasks-i-sharepoint-2013/ Aggregate tasks i Sharepoint ...