Jquery实现“Iframe”页面切换

一:Defualt.aspx页面下的“IFrame”

        <iframe id="BoardTitle" name="BoardTitle" style="height: 100%; visibility: inherit; width: 198; z-index: 2"
                    scrolling="auto" frameborder="0" src="left.aspx"></iframe> 

        <iframe id="mainFrame" name="mainFrame" style="height: 100%; visibility: inherit;
                    width: 100%; z-index: 1" scrolling="auto" frameborder="0" src="Welcome.aspx"></iframe> 

 

二:实现切换页面

     <script type="text/javascript">

        function b_click() {
            $('#BoardTitle', parent.document).attr("src", "Admin/TVDepartAll.aspx");
            $('#mainFrame', parent.document).attr("src", "Welcome.aspx");
//            window.location.href = window.location.href;
  
        };
       
  
        function bt_un_click() {
            $('#BoardTitle', parent.document).attr("src", "left.aspx");
            $('#mainFrame', parent.document).attr("src", "Admin/TVDepartAll.aspx");
//            window.location.href = window.location.href;
        };
        function NowShow(Url) {
            window.parent.frames["mainFrame"].location = Url;
        }
    </script> 

 

    

       <input id="Bt_Binding" type="button" value="绑定"  class="buttoncss" onclick="b_click()" />&nbsp;<input id="Button1" type="button" value="解绑"  class="buttoncss" onclick="bt_un_click()" /> 

 

三: 与“TreeView”结合,使页面显示到指定框架

       myNode.NavigateUrl = "javascript:NowShow('"+url_all+"')";
        //myNode.Target = "mainFrame"; 

 

四:注意

     1、切换时,切换的页面会被重新加载。

     2、 Jquery获取Document元素时是“$ ”和“#”的筛选器。

 

    最后,加一分呗。 

 

 

 

 

posted on 2012-04-25 21:41  [CC]  阅读(3971)  评论(0编辑  收藏  举报

导航