每次点击icon-class时,jquery easyui都会动态创建标签以刷新包含的iframe

时间:2013-02-20 16:26:38

标签: jquery jquery-easyui

我动态地构建了以下树形标签。这些选项卡有一个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重载方法,但没有任何成功。

你能帮我解决这个问题吗? 非常感谢!

1 个答案:

答案 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>