Ajax实现评论提交

2016-02-19 12:59 10 1 收藏

有了下面这个Ajax实现评论提交教程,不懂Ajax实现评论提交的也能装懂了,赶紧get起来装逼一下吧!

【 tulaoshi.com - Web开发 】

代码如下:


document.write('DIV id="loadingg"  style="HEIGHT:65px; WIDTH: 205px;POSITION: absolute; Z-INDEX:1000;border:3px #fff solid;text-align:center; font-size:12px; font-family:Arial, Helvetica, sans-serif;color:#660000;background:#222;opacity:.7;-moz-opacity:.7;filter: alpha(opacity=70); display:none;"br/font color="#FF6600"strong数据正在读取中,请等候.../strong/fontbr/img src="images/loading.gif"//DIV')
function showloading() 
{
var obj=document.getElementById("loadingg")
if (obj.style.display!="")
{
obj.style.left=((document.documentElement.clientWidth-parseFloat (obj.style.width))/2)+document.documentElement.scrollLeft+"px";
obj.style.top=((document.documentElement.clientHeight-parseFloat (obj.style.height))/2)+document.documentElement.scrollTop+"px";
obj.style.display="";
}else{obj.style.display="none";}
}
function $(id)
{    return document.getElementById(id);    }
function echo(obj,html){    $(obj).innerHTML=html;}
function fopen(obj){$(obj).style.display="";}
function fclose(obj){$(obj).style.display="none";}
function createxmlhttp(){
    var xmlhttp=false;
    try    {
          xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
     } 
    catch (e) {
          try {
               xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
          } 
        catch (e) {
               xmlhttp = false;
         }
     }
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
          xmlhttp = new XMLHttpRequest();
                if (xmlhttp.overrideMimeType) {//设置MiME类别
            xmlhttp.overrideMimeType('text/xml');
        }
    }    
    return xmlhttp;    
}

function getdata(url,obj1,obj2)
{        var xmlhttp=createxmlhttp();
        if(!xmlhttp)
        {alert("你的浏览器不支持XMLHTTP!!");
            return;
        }
        showloading() 
        xmlhttp.onreadystatechange=requestdata;
        xmlhttp.open("GET",url,true);
        xmlhttp.send(null);
        function requestdata()
        {        fopen(obj1);
                //echo(obj1,"正在加载数据,请稍等......");
                //alert(xmlhttp.readyState)
                if(xmlhttp.readyState==4)
                {    if(xmlhttp.status==200)
                    {    if(obj1!=obj2){fclose(obj1);};
                        echo(obj2,xmlhttp.responseText);
                        showloading() 
                    }
                }            
        }
}
function postdata(url,obj,data)
{       var rnd=Math.random()
        var xmlhttp=createxmlhttp();
        if(!xmlhttp)
        {
            alert("你的浏览器不支持XMLHTTP!!");
            return;
        }
        showloading() 
        xmlhttp.open("POST", url, true);
        xmlhttp.onreadystatechange=requestdata;
        xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        xmlhttp.send(data);
        function requestdata()
        {    fopen(obj);
            echo(obj,"正在提交数据,请稍等......");
            if(xmlhttp.readyState==4)
            {    if(xmlhttp.status==200)
                {
                    echo(obj,xmlhttp.responseText);
                    reget(rnd);
                    setTimeout("echo('showresult','')",2000);
                    echo('Message','')
                    showloading() 
                }
            }
        }
}
function lTrim(str)
{
  if (str.charAt(0) == " ")
  {
    //如果字串左边第一个字符为空格
    str = str.slice(1);//将空格从字串中去掉
    //这一句也可改成 str = str.substring(1, str.length);
    str = lTrim(str);    //递归调用
  }
  return str;
}

//去掉字串右边的空格
function rTrim(str)
{
  var iLength;

  iLength = str.length;
  if (str.charAt(iLength - 1) == " ")
  {
    //如果字串右边第一个字符为空格
    str = str.slice(0, iLength - 1);//将空格从字串中去掉
    //这一句也可改成 str = str.substring(0, iLength - 1);
    str = rTrim(str);    //递归调用
  }
  return str;
}

//去掉字串两边的空格
function trim(str)
{
  return lTrim(rTrim(str));
}

function f(obj)
{
    return trim(eval("document.ajax_post."+obj+".value"));
    //return trim($(obj).value);
}

function SaveReply()
{    if(f("username")=="")
    {    alert("请填写用户名");
        return false;
    }
    if(f("Message")=="")
    {    alert("内容不可為空");
        return false;
    }
    var validate,password,log_DisKey=0,log_DisURL=0,log_DisSM=0
    validate=""
    password=""
    if(document.ajax_post.log_DisKey.checked){
        log_DisKey=f("log_DisKey")
        }
    if(document.ajax_post.log_DisURL.checked){
        log_DisURL=f("log_DisURL")
        }
    if(document.ajax_post.log_DisSM.checked){
        log_DisSM=f("log_DisSM")
        }
    if((typeof eval(document.ajax_post.validate))!="undefined"){
        if(f("validate")=="")
        {    alert("请填写验证码");
            return false;
        }else{
            validate=f("validate");
        }
    }    
    if((typeof eval(document.ajax_post.password))!="undefined"){
        password=f("password");
    }
    data="username="+escape(f("username"))+"&password="+escape(password)+"&validate="+escape(validate)+"&log_DisSM="+escape(log_DisSM)+"&log_DisURL="+escape(log_DisURL)+"&log_DisKey="+escape(log_DisKey)+"&Message="+escape(f("Message"))+"&logID="+escape(f("logID"))+"&action="+escape(f("action"));
    //alert(data);
    postdata("wbc_blogcomm.asp","showresult",data);
    return true;
}

来源:http://www.tulaoshi.com/n/20160219/1602698.html

延伸阅读
标签: Web开发
Ajax内部交流文档一、使用Ajax的主要原因  1、通过适当的Ajax应用达到更好的用户体验;  2、把以前的一些服务器负担的工作转嫁到客户端,利于客户端闲置的处理能力来处理,减轻服务器和带宽的负担,从而达到节约ISP的空间及带宽租用成本的目的。     二、引用  Ajax这个概念的最早提出者Jesse&...
标签: Web开发
今天终于解决了AJAX的中文乱码问题,写篇文章来帮助一下有同样问题的朋友们。我的开发环境:XP, eclipse,使用GB18030编码。 当遇到这个问题时,到网上去查了好多文章,提到几种解决方案,如:全站UTF-8编码;请求头编码为中文;使用javascript中的escape函数。 使用GET方式提交数据的时候,中文问题很好解决,setrequestheader("Content-Type...
标签: Web开发
Ajax内部交流文档一、使用Ajax的主要原因 1、通过适当的Ajax应用达到更好的用户体验; 2、把以前的一些服务器负担的工作转嫁到客户端,利于客户端闲置的处理能力来处理,减轻服务器和带宽的负担,从而达到节约ISP的空间及带宽租用成本的目的。 二、引用 Ajax这个概念的最早提出者Jesse James Garrett认为: Ajax是A...
标签: Web开发
客户端部分: 代码如下: html head meta http-equiv="Content-Type" content="text/html"/ script language="javascript" var ajax; function createAjax() { if(window.ActiveXObject) { try { return new ActiveXObject("Msxm12.XMLHTTP"); } catch(e) { try { return new ActiveXObject("Microsoft.XMLHTTP"); } cat...
标签: Web开发
找遍资料得出结果:不能 不过同时也找到了解决办法,就是用iframe的方式来提交表单,即实现无刷新提交表单又可以上传文件! 一、HTML代码 代码如下: !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" html xmlns="http://www.w3.org/1999/xhtml" head meta ...

经验教程

833

收藏

32

精华推荐

JQuery打造PHP的AJAX表单提交实例

JQuery打造PHP的AJAX表单提交实例

葑茚佩恩

Ajax异步(请求)提交类 支持跨域

Ajax异步(请求)提交类 支持跨域

美术班的鬼才

一个jsp+AJAX评论系统

一个jsp+AJAX评论系统

宝鸡大叔

微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部