用ajax实现在单击事件下加载一个DIV层的脚本 - 快车库

用ajax实现在单击事件下加载一个DIV层的脚本

520 查看

我想做一个类似QQ空间评论的功能
不知大家发现了没有 QQ空间只有点击了那个文本框后编辑器才会加载出来
并不是那种先隐藏通过单击后才显示的

<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>  
<title>无标题文档</title>  
<script type="text/javascript">  
//the function can get the content of right page when user click the link in the left side  
var xmlHttp;  
var searching=false;  
var myDivName="";  
function getXMLHTTP(){  
    A = new ActiveXObject("microsoft.xmlhttp");  
    return A;  
}  
function executeQuery(divName,url)  
{  
    searching = true;  
    myDivName = divName;  
    if(xmlHttp && xmlHttp.readystate != 0) {  
        xmlHttp.abort();  
    }  
    xmlHttp=getXMLHTTP();  
    var tempurl="";  
    if(xmlHttp && myDivName!=""){  
        tempurl += url + ".htm" + "?";//加载文挡类型  
        tempurl += "&" + new Date().getTime();  
        xmlHttp.open("Get", tempurl , true);  
        xmlHttp.onreadystatechange = getReturnHtml;  
        xmlHttp.send(null);  
    }else{  
        searching = false;  
        myDivName = "";  
        window.alert('系统太忙，请稍后再试！');  
        return false;  
    }  
}  
function getReturnHtml(){  
        if(xmlHttp.readyState==1)  
    {  
    document.getElementById(myDivName).innerHTML ="<img src='http://www.jb51.net/logo.gif'/>";  
    }  
      
    else if(xmlHttp.readystate == 4 && xmlHttp.responsetext && searching) {  
            //alert (myDivName);  
        document.getElementById(myDivName).innerHTML = xmlHttp.responsetext;  
        //alert(xmlHttp.responseText);  
        searching = false;  
    } else{  
        document.getElementById(myDivName).innerHTML ="拒绝访问";  
        }  
}  
</script>  
<style type="text/css">  
  
</style>  
  
  
<div id="Layer1"></div>  
<label>  
<input name="Submit" onclick="executeQuery('Layer1','http://www.jb51.net')" type="button" value="在下面加载新闻"/>  
</label>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

最近更新的内容

一个方便AJAX开发的通用类
AJAXRequest v0.2
结合AJAX进行PHP开发之入门
变量冲突处理
ajax实现标签导航
如何解决远程页面抓取中的乱码问题
用 ajax 的方法解决网页广告显示的问题
AJAX开发者的最新工具和技术
AJAX应用之草稿自动保存
用Ajax读取XML格式的数据

你可能感兴趣的文章

如何解决ajax在google chrome浏览器上失效
ajax内部值外部调用不了的原因及解决方法
jQuery下的Ajax调试步骤
Ajax请求中async:false/true的作用分析
Ajax方式实现定期更新页面某块内容的方法
ajax读取properties资源文件数据的方法
使用对象封装ajax重复调用的方法
使用ajax实现无刷新改变页面内容和地址栏URL
js实现简单实用的AJAX完整实例
JQuery ajax 返回json时出现中文乱码该如何解决

2025 - 快车库 - 我的知识库重庆启连科技有限公司渝ICP备16002641号-10
企客连连表单助手企服开发榜单123

渝公网安备 50010702501581号