思想碎片@Zx.MYS - Z-BLOG JavaScript修改（一）：评论相关

2007-08-08 Update:我又改了个新版的出来，在这里。

上次我稍稍修改了下Z-BLOG的JS，看大家对评论方面的修改比较感兴趣，我今天就介绍一下如何实现这个方法

首先，打开SCRIPT/COMMON.JS，在文件尾部加入下列代码

      //Z-BLOG JavaScript修改，By Zx.MYS
      //Http://ZxMYS.COM

      //以下是弹出消息的函数
      function sAlert(str,msgw,msgh,left,top){
      var msgw,msgh,bordercolor;
      //msgw=400;//提示窗口的宽度
      //msgh=100;//提示窗口的高度
      titleheight=25 //提示窗口标题高度
      bordercolor="#336699";//提示窗口的边框颜色
      titlecolor="#99CCFF";//提示窗口的标题颜色
      
      var sWidth,sHeight;
      sWidth=document.body.offsetWidth;
      sHeight=screen.height;

      //var bgObj=document.createElement("div");
      //bgObj.setAttribute('id','bgDiv');
      //bgObj.style.position="absolute";
      //bgObj.style.top="0";
      //bgObj.style.background="#777";
      //bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
      //bgObj.style.opacity="0.6";
      //bgObj.style.left="0";
      //bgObj.style.width=sWidth + "px";
      //bgObj.style.height=sHeight + "px";
      //bgObj.style.zIndex = "10000";
      //document.body.appendChild(bgObj);
      
      var msgObj=document.createElement("div")
      msgObj.setAttribute("id","msgDiv");
      msgObj.setAttribute("align","center");
      msgObj.style.background="white";
      msgObj.style.border="1px solid " + bordercolor;
        msgObj.style.position = "absolute";
            msgObj.style.left = left;
            msgObj.style.top = top;
            msgObj.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
            msgObj.style.marginLeft = "-225px" ;
            msgObj.style.marginTop = -75+document.documentElement.scrollTop+"px";
            msgObj.style.width = msgw + "px";
            msgObj.style.height =msgh + "px";
            msgObj.style.textAlign = "center";
            msgObj.style.lineHeight ="25px";
            msgObj.style.zIndex = "10001";
   
       var title=document.createElement("h4");
       title.setAttribute("id","msgTitle");
       title.setAttribute("align","right");
       title.style.margin="0";
       title.style.padding="3px";
       title.style.background=bordercolor;
       title.style.filter="progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
       title.style.opacity="0.75";
       title.style.border="1px solid " + bordercolor;
       title.style.height="18px";
       title.style.font="12px Verdana, Geneva, Arial, Helvetica, sans-serif";
       title.style.color="white";
       title.style.cursor="pointer";
       title.innerHTML="关闭";
       title.onclick=function(){
            //document.body.removeChild(bgObj);
                document.getElementById("msgDiv").removeChild(title);
                document.body.removeChild(msgObj);
                }
       document.body.appendChild(msgObj);
       document.getElementById("msgDiv").appendChild(title);
       var txt=document.createElement("p");
       txt.style.margin="1em 0"
       txt.setAttribute("id","msgTxt");
       txt.innerHTML=str;
           document.getElementById("msgDiv").appendChild(txt);
            }
            
//以下两段是分离出action里KEY的代码。感谢！（QQ105177737）同志给我写的，大好人啊！大家祝他妻妾成群，儿孙满堂^_^         
String.prototype.Trim = function()
{
  return this.replace(/^\s*|\s*$/g,"");
}


function getQueryString(key,str)
{
  if(str.length)
    str = str.substring(1);
  else
    return "";

  var arr = str.split("&");
  
  for(var i=0;i<arr.length;i++)
  {
    var cur = arr[i].split("=");
    if(cur[0].Trim().toLowerCase() == key.toLowerCase())
    {
      return escape(cur[1]);
      break;
    }
  }
  return "";
}

//以下是从回复状态返回发表新评论状态的函数
function revnothing() {
  document.getElementById("frmSumbit").action= str00 + "cmd.asp?act=cmt&key=" + getQueryString("key",document.getElementById("frmSumbit").action);
  document.getElementById("SumbitState").innerHTML="";
}

然后，再将RevertComment函数修改为

function RevertComment(intRevertID,commenuser) {
  var f;
  revnothing()
  if(objActive){
    f=document.getElementById(objActive).form
  }
  else{
    f=document.getElementsByTagName("form")[document.getElementsByTagName("form").length-1]
  }
  f.action=f.action.replace("cmd.asp?act=cmt","cmd.asp?act=CommentRev&id="+intRevertID);
  document.getElementById("SumbitState").innerHTML="你将回复" + commenuser + "的评论，或者<a href=\"javascript:revnothing()\">单独发表一篇新评论</a><br/>";
}

将VerifyMessage函数修改为

function VerifyMessage() {
      //document.frmsumbit.btnSumbit.disabled=true;
  document.getElementsByName("btnSumbit")[0].value="提交中……";
  document.getElementById("SumbitState").innerHTML="<img src=\"" + str00 + "UPLOAD/Loading.gif\"/>";
  var strName=document.getElementById("inpName").value;
  var strEmail=document.getElementById("inpEmail").value;
  var strHomePage=document.getElementById("inpHomePage").value;
  var strArticle;

  if(document.getElementById("txaArticle").value){
    strArticle=document.getElementById("txaArticle").value;
  }
  else{
    strArticle=document.getElementById("txaArticle").innerText;
  }

  if(strName==""){
    alert(str01);
    document.getElementsByName("btnSumbit")[0].value="提交";
    return false;
  }
  else{
    re = new RegExp("^[.A-Za-z0-9\u4e00-\u9fa5]+$");
    if (!re.test(strName)){
      alert(str02);
      document.getElementsByName("btnSumbit")[0].value="提交";
      return false;
    }
  }

  if(strEmail==""){
    //alert(str01);
    //return false;
  }
  else{
    re = new RegExp("^[\\w-]+(\\.[\\w-]+)*@[\\w-]+(\\.[\\w-]+)+$");
    if (!re.test(strEmail)){
      alert(str02);
      document.getElementsByName("btnSumbit")[0].value="提交";
      document.getElementById("SumbitState").innerHTML=""
      return false;
    }
  }

  if(typeof(strArticle)=="undefined"){
    alert(str03);
    document.getElementsByName("btnSumbit")[0].value="提交";
    document.getElementById("SumbitState").innerHTML=""
    return false;
  }

  if(typeof(strArticle)=="string"){
    if(strArticle==""){
      alert(str03);
      document.getElementsByName("btnSumbit")[0].value="提交";
      document.getElementById("SumbitState").innerHTML=""
      return false;
    }
    if(strArticle.length>intMaxLen)
    {
      alert(str03);
      document.getElementsByName("btnSumbit")[0].value="提交";
      document.getElementById("SumbitState").innerHTML=""
      return false;
    }
  }

  document.getElementById("inpArticle").value=strArticle;
  document.getElementById("inpLocation").value=parent.window.location.href;
  if(!document.getElementById("frmSumbit").action){
    document.getElementById("frmSumbit").action=str00+"cmd.asp?act=cmt";
  }


  var bolRemember=document.getElementById("chkRemember").checked;

  if(bolRemember==true){
    SaveRememberInfo();
  }
  else{
    SetCookie("chkRemember",bolRemember,365);
  }


  //ajax comment begin
  $.post(document.getElementById("frmSumbit").action,
    {
    "inpAjax":true,
    "inpID":$("#inpId").val(),
    "inpVerify":(document.getElementById("inpVerify")?$("#inpVerify").val():""),
    "inpEmail":strEmail,
    "inpName":strName,
    "inpArticle":strArticle,
    "inpHomePage":strHomePage
    },
    function(data){
      var s =data;
      if((s.search("faultCode")>0)&&(s.search("faultString")>0))
      {
        alert(s.match("<string>.+?</string>")[0].replace("<string>","").replace("</string>",""))
        document.getElementsByName("btnSumbit")[0].value="提交";
        document.getElementById("SumbitState").innerHTML=""
      }
      else{
        var i=Math.round(Math.random()*1000)
        var s ="<div id=\"divAjaxComment"+i+"\">"+data+"</div>";
        $(s).insertBefore("#divAjaxComment");
        $("#divAjaxComment"+i).fadeIn("slow");
        //以下是评论成功后的提示。
        sAlert("<img src=\"" + str00 + "image/face/Haha.gif\">已经提交,感谢您的评论！",300,100,"55%","50%")
        setTimeout("document.getElementById(\"msgTitle\").innerHTML=\"（3秒后自动关闭……）[点击关闭]\"",1000)
        setTimeout("document.getElementById(\"msgTitle\").innerHTML=\"（2秒后自动关闭……）[点击关闭]\"",2000);
        setTimeout("document.getElementById(\"msgTitle\").innerHTML=\"（1秒后自动关闭……）[点击关闭]\"",3000);
        setTimeout(eval(document.getElementById("msgTitle").onclick),4000)
        document.getElementById("VerifyCodeImg").src=str00 + "/function/c_validcode.asp?name=commentvalid";
        document.getElementById("txaArticle").value="";
        revnothing();
        document.getElementsByName("btnSumbit")[0].value="提交";
        document.getElementById("SumbitState").innerHTML=""
      }
    }
  );
  return false;

  //ajax comment end

}

接着，修改TEMPLATE/b_article_commentpost.html，在想要显示提示和LOADING图的地方插入

<span id="SumbitState" style="font-weight:bold;"></span>

然后下载一个LOADING图（可以用我这个：HTTP://ZxMYS.Com/UPLOAD/Loading.gif），放到UPLOAD目录下，命名为Loading.gif

最后进行文件重建

至此，已经全部修改完毕咯~

如果觉得还不错，欢迎将本文在表明作者和原出处的前提下四处转载~

“思想碎片@Zx.MYS”博客文章除注明外，均为原创。采用知识共享（CC）署名-非商业性使用-相同方式共享 2.5 中国大陆许可协议进行许可
欢迎在注明来自“思想碎片@Zx.MYS”和[http://ZxMYS.Com/post/Z-BLOGJS1_9258.html]链接的情况下自由转载

导航

2007-5-19 23:1:53

Z-BLOG JavaScript修改（一）：评论相关

Previous最新文章

Comments最新评论及回复

Guests最近留言

Catalog网站分类

Archives文章归档

Referer来源

Powered By Z-Blog 1.8 Devo Build 80201

作者：Zx.MYS
本Blog内所有原创作品（包括但不限于文字、图片）采用知识共享（CC）署名-非商业性使用-相同方式共享 2.5 中国大陆许可协议进行许可。
Template By ZxMYS.COM&XuZiKun.COM，版权所有，禁止任何形式的抄袭。

导航