解析讓圖片頻道也調(diào)用AJAX評(píng)論的步驟_動(dòng)易Cms教程

      編輯Tag賺U幣
      教程Tag:暫無(wú)Tag,歡迎添加,賺取U幣!

      第一步:添加{$MY_ajax圖片評(píng)論}標(biāo)簽

      此標(biāo)簽的內(nèi)容可以仿文章的這個(gè)ajax評(píng)論標(biāo)簽,需要注意的是要把文章ajax評(píng)論標(biāo)簽里的所有“Article”字樣的代碼都要替換成“Photo”,或復(fù)制以下的代碼:

      <!-- 為評(píng)論列表增加CSS控制: -->
      <STYLE type=text/css>.commentTable
      {
       padding:5px; border:#98d0f8 1px solid; text-align:center;
      }
      .commentTable th
      {
       color:#008000;
      }
      .commentTable th, .commentTable td
      {
       border-right:#98d0f8 1px solid;border-bottom:#98d0f8 1px solid;
      }
      td.commentPager
      {
       border:none;
      }
      td.commentTdEnd,th.commentTdEnd
      {
       border-right:none;
      }
      .commentTitle
      {
       background:#e7f5fe;
      }
      .commentListOver
      {
       background:#f3f9f4;
      }
      </STYLE>
      <script language="javascript">
      function SetWinHeight(obj)
      {
       var iComment=obj;
       if (document.getElementById)
       {
        if (iComment && !window.opera)
        {
         if (iComment.contentDocument && iComment.contentDocument.body.offsetHeight)
          iComment.height = iComment.contentDocument.body.offsetHeight;
         else if(iComment.Document && iComment.Document.body.scrollHeight)
          iComment.height = iComment.Document.body.scrollHeight;
        }
       }
      }
      function  ShowComment()  {
       var pars;
       var ModuleName = "{$ChannelDir}";
       var InfoID = "{$PhotoID}";
       var Titlelen = "";  //內(nèi)容摘要長(zhǎng)度,默認(rèn)是20
       var Tablelen = "";  //調(diào)用表格寬度,如100%或760
       var MaxPerPage = 2;  //每頁(yè)調(diào)用數(shù)量
       pars="ModuleName="+ModuleName+"&InfoID="+InfoID+"&Titlelen="+Titlelen+"&Tablelen="+Tablelen+"&MaxPerPage="+MaxPerPage;
       new Ajax.Updater(
       "leaveMsgList",
       "{$InstallDir}Include/PowerEasy.Comment_Ajax.asp?rnd="+Math.random(),
       {
       method:"get",
       parameters  :pars,
       evalScripts :true,
       asynchronous:true
       });
      }
      function ajaxPager(pars)
      {
       new Ajax.Updater(
       "leaveMsgList",
       "{$InstallDir}Include/PowerEasy.Comment_Ajax.asp",
       {
       method:"get",
       parameters: pars
       });
      }
      </script>
      <div id=leaveMsgList>數(shù)據(jù)載入中,請(qǐng)稍后…… </div>
      <script type="text/javascript">
      ShowComment();
      </script>
      <script type="text/javascript">
      if ({$ClassID}==-1)
      {}
      else
      {
      document.write ("<IFRAME id=iComment name=iComment src='{$InstallDir}{$ChannelDir}/Comment.asp?PhotoID={$PhotoID}' frameBorder=0 width='100%' scrolling=no onload=Javascript:SetWinHeight(this)></IFRAME>")
      }
      </script>

       

      第二步:修改圖片頻道的內(nèi)容頁(yè)模板

      1、在<head>..</head>之間添加以下三行JS調(diào)用代碼

      <script src="{$InstallDir}JS/prototype.js"></script>

      <script src="{$InstallDir}JS/scriptaculous.js"></script>

      <script src="{$InstallDir}JS/checklogin.js"></script>

      2、然后在<body>相應(yīng)的位置里設(shè)置調(diào)用第一步添加好了的{$MY_ajax圖片評(píng)論}標(biāo)簽

       

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
      <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
      <title>{$PageTitle}</title>
      <link href="{$InstallDir}Images/favicon.ico" type="image/x-icon" rel="icon">
      <link href="{$InstallDir}Images/favicon.ico" type="image/x-icon" rel="shortcut icon">
      {$ShowJS_Comment}
      <script language=javascript>
      function refreshimg(){
        document.all.checkcode.src='../Inc/CheckCode.asp?'+Math.random();
      }
      </script>
      <script language='JavaScript' type='text/JavaScript'>
         function Check()
         {
          if (document.form1.Name.value=='')
          {
           alert('請(qǐng)輸入姓名!');
           document.form1.Name.focus();
           return false;
          }
          if (document.form1.Email.value=='')
          {
           alert('請(qǐng)輸入Email!');
           document.form1.Email.focus();
           return false;
          }
          if (document.form1.Content.value=='')
          {
           alert('請(qǐng)輸入評(píng)論內(nèi)容!');
           document.form1.Content.focus();
           return false;
          }

       return true;
         }
         </script>

      <style>th{ color:#000; font-size:12px; font-weight:normal;text-align:right;padding-right:5px}
      img{ border:0px}
      .m720{
       BORDER: #92b0dd 1px solid; PADDING: 5px 5px 5px 5px;margin:5px 0px 5px 0px; BACKGROUND-COLOR: #ebf4ff}
      .declare { color:#000; font-size:12px; font-weight:normal;}</style>
      </head>
      <body>
      <!-- ********網(wǎng)頁(yè)中部代碼開(kāi)始******** -->
      <div id="globalComments">
        <form action="Comment.asp" onsubmit="return Check();" method="post" name="form1" id="form1">
          <table border="0">
            <tr>
              <th>用戶名</th>
              <td><Input name="Name" type="text" id="Name" size="30" maxlength="16" value="{$UserName}" class="textInput">
                <FONT color=red>*</FONT></td>
              <td rowspan="4" valign="top"><textarea name="Content" cols="45" rows="5" ></textarea>
              </td>
            </tr>
            <tr>
              <th>電子郵件地址</th>
              <td><input name="Email" type="text" id="Email" size="30" maxlength="100" value="{$UserEmail}" class="textInput" /></td>
            </tr>
            <tr>
              <th>評(píng)價(jià)等級(jí)</th>
              <td><input name="Score" type="radio" value="1" id="Score1" />
                <label for="Score1">1</label>
                <input name="Score" type="radio" value="2" id="Score2" />
                <label for="Score2">2</label>
                <input name="Score" type="radio" value="3" id="Score3" />
                <label for="Score3">3</label>
                <input name="Score" type="radio" value="4" id="Score4" />
                <label for="Score4">4</label>
                <input name="Score" type="radio" value="5" checked="checked" id="Score5" />
                <label for="Score5">5</label>
              </td>
            </tr>
      <tr>
            <th> </th>
              <td><Input id="photo" type="hidden" value="Save" name="photo">
                <Input id="photoID" type="hidden" value="{$photoID}" name="photoID">
                <input type="image" src="{$InstallDir}images/btn_submit.gif" />
                <img src="{$InstallDir}images/btn_reset.gif" onclick="form1.reset();" alt="Reset" style="cursor:pointer;" /> </td>
            </tr>
          </table>
        </form>
      </div>
      </div>
      <!-- ********網(wǎng)頁(yè)中部代碼結(jié)束******** -->
      </body>
      </html>

       

      至此,我們就完成了圖片頻道也可以調(diào)用AJAX評(píng)論的功能

      第三步:添加圖片默認(rèn)評(píng)論ajax模板

      查看更多 動(dòng)易Cms教程  動(dòng)易Cms模板

      來(lái)源:模板無(wú)憂//所屬分類:動(dòng)易Cms教程/更新時(shí)間:2009-07-20
      相關(guān)動(dòng)易Cms教程