zoukankan      html  css  js  c++  java
  • div+ajax 实现网页框架布局

    核心代码:

    function fnSuccMainBody(xhr){
    	// main body
    	document.getElementById("main").innerHTML = xhr.responseText;
    	
    	// sub : sub body
    	if(document.getElementById("submain") != null)
    		ShowComments();
    }
    
    function fnSuccSubMainBody(xhr){
    	document.getElementById("submain").innerHTML = xhr.responseText;
    }
    
    function AjaxRequest(url, data, fnSucc)
    {       
    	var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
            
    	xhr.onreadystatechange = function(){
    		AjaxCallBack(xhr, fnSucc);
    	};
            
    	xhr.open("post", url, true);
    	xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded;');
    	 
    	xhr.send(data);
    }
    
    function AjaxCallBack(xhr, fnSucc)
    {
    	if(xhr.readyState == 4)
    	{
    		var s = xhr.status;
    		if(s >= 200 && s < 300)
    			fnSucc(xhr);
    		else
    			;
    	}	
    }
    
    // 调用
    function showMain()
    {
    	var url = xxx;
    	var data = xxx;
    	AjaxRequest(url, data, fnSuccMainBody);		
    }
    
    function showSubMain()
    {
    	var url = xxx;
    	var data = xxx;
    	AjaxRequest(url, data, fnSuccSubMainBody);			
    }

    参考:

    div+ajax实现类似iframe功能

    http://lz12366.iteye.com/blog/1137458

    frameset和div常规布局的优缺点比较

    http://blog.csdn.net/zhangxinrun/article/details/5677829

  • 相关阅读:
    webpack特点,安装,兼容性
    我们为什么需要构建工具
    vue-router keep-alive
    Es6模块化
    AMD-require.js
    CommonJs
    OJ
    算法
    flex属性 flex-grow、flex-shrink、flex-basic
    js过滤数组中的空值
  • 原文地址:https://www.cnblogs.com/silyvin/p/9106859.html
Copyright © 2011-2022 走看看