ExtJs中如何灵活使用Iframe!

xtJS虽然能够作出非常华丽的页面，但对于大量的数据显示来说任然存在着很多的不足！而使用iframe则可以巧妙的解决该问题，使我们运用Ext更加灵活自如，将我们的项目做得更加完美！下面讲述的就是iframe的简单用法：（如有更好的解决方案望各位指出）

1.index.html:

<script type="text/javascript">

  var addWin = null;

  var editWin = null;

  var fun_del ;

   Ext.onReady(function(){

   editWin = new Ext.Window({

   id:'editWin',

    title : '编辑窗口',

    width : 400,

    height : 350,

    modal : true,

    closeAction : 'hide',

    html:'This is editForm!'

   });

   

   addWin = new Ext.Window({

    id:'addWin',

    title : '主窗口',

    width : 400,

    height : 350,

    modal : true,

    closeAction : 'hide',

    html:'<iframe id="frame" name="frame" src="frame.html" width=100% height=100%/>'

   });

   addWin.show();

   

   fun_del = function(){

    alert('This is delete function!');

   }

   });

</script>

 




2.frame.html


<script type="text/javascript">

  function changeWin(){

   Ext.onReady(function() {

      parent.addWin.hide();

      parent.editWin.show();

   });

  }

  function delWin(){

   parent.fun_del();

  }

</script>



<body>

  <a href="">编辑</a>

  <a href="">删除</a>

</body>

 

你可能感兴趣的:(iframe)