我动态地构建了以下树形标签。这些选项卡有一个iframe,该源是从json文件中获取的:
<script type="text/javascript">
$(function(){
$('#tree_menu').tree({
animate:true,
onClick: function open1(node){
if ($('#tabs').tabs('exists',node.id)){
$('#tabs').tabs('select', node.id);
} else {
$('#tabs').tabs('add',{
title: node.id,
content: "<iframe id='superframe' frameborder='0' width='100%' scrolling='auto' height='99%' src='" + node.attributes.url + "'><iframe>",
closable:true,
tools:[{
iconCls:'icon-mini-refresh',
handler:function(){
alert('refreshing');
$('#superframe').get(0).contentWindow.location.reload();
}
}]
});
}
}
});
$('#tabs').tabs({
onBeforeClose: function(title){
return confirm('Are you sure you want to close ' + title);
}
});
});
</script>
我想要实现的是在选项卡图标上单击了mini-refresh,以在该特定选项卡中重新加载iframe。 使用上面的代码,我能够做到这一点,但它只适用于第一个打开的选项卡。从第二个开始它不再起作用了。这不是令人耳目一新.... 我已经尝试了谷歌上发现的所有可能的iframe重载方法,但没有任何成功。
你能帮我解决这个问题吗? 非常感谢!
答案 0 :(得分:2)
iframe的ID应该是唯一的,请尝试以下代码,
<script type="text/javascript">
$(function(){
$('#tree_menu').tree({
animate:true,
onClick: function open1(node){
if ($('#tabs').tabs('exists',node.id)){
$('#tabs').tabs('select', node.id);
} else {
var frameId='superframe'+node.id;
$('#tabs').tabs('add',{
title: node.id,
content: "<iframe id='"+frameId+"' frameborder='0' width='100%' scrolling='auto' height='99%' src='" + node.attributes.url + "'><iframe>",
closable:true,
tools:[{
iconCls:'icon-mini-refresh',
handler:function(){
alert('refreshing');
$('#'+frameId).get(0).contentWindow.location.reload();
}
}]
});
}
}
});
$('#tabs').tabs({
onBeforeClose: function(title){
return confirm('Are you sure you want to close ' + title);
}
});
});
</script>