So fügen Sie die Like-Funktion zur Homepage-Listenseite von Empire CMS hinzu-js-Tutorial-php.cn

So fügen Sie die Like-Funktion zur Homepage-Listenseite von Empire CMS hinzu

php中世界最好的语言

Freigeben： 2017-12-30 17:57:32

Original

2703 Leute haben es durchsucht

Was ich Ihnen dieses Mal zeigen werde, ist, wie Sie die „Gefällt mir“-Funktion zur Homepage-Listenseite von Empire CMS hinzufügen können. Die Empire CMS-Vorlage ist sehr einfach zu verwenden. Wenn Sie einige Funktionen hinzufügen möchten, die Sie basierend auf der Vorlage benötigen. Wie soll man es umsetzen? Dieser Artikel gibt Ihnen eine gute Analyse.

Überprüfen Sie den Inhaltsseitenvorlagencode des Nachrichtensystems des Empire CMS Website Builder und finden Sie den HTML-Codeblock für die Likes, wie unten gezeigt:

<table border="0" align="center" cellpadding="0" cellspacing="0" class="digg"> 
<tr> 
<td class="diggnum" id="diggnum"><strong><script type="text/javascript" src="[!--news.url--]e/public/ViewClick/?classid=[!--classid--]&id=[!--id--]&down=5"></script></strong></td> 
</tr> 
<tr> 
<td class="diggit"><a href="JavaScript:makeRequest(&#39;[!--news.url--]e/public/digg/?classid=[!--classid--]&id=[!--id--]&dotop=1&doajax=1&ajaxarea=diggnum&#39;,&#39;EchoReturnedText&#39;,&#39;GET&#39;,&#39;&#39;);" rel="external nofollow" >来顶一下</a></td> 
</tr> 
</table>

Nach dem Login kopieren

Aus dem obigen Code können wir das Kennen Sie die aktuelle Gesamtzahl der Likes. Die Ausgabe erfolgt in Echtzeit durch dynamisches Laden von Skripten, und die Funktion makeRequest() auf dem Tag a wird zum Implementieren der Like-Funktion verwendet. Der erste Parameter der Funktion makeRequest() ist die Anfrageadresse und wird von Parameterdaten begleitet. Der zweite Parameter ist der Name der Callback-Funktion , die nach einer erfolgreichen Anfrage ausgeführt werden soll Modus. Nachdem Sie das Implementierungsprinzip verstanden haben, ist es einfach, die Like-Funktion auf anderen Seiten der Website zu implementieren. Der relevante Code für die Implementierungsmethode ist unten angegeben.

Wenn wir beispielsweise die Like-Funktion auf der Produktlistenvorlagenseite implementieren müssen, müssen wir zuerst den Code der Produktlistenvorlage ändern. Das Folgende ist mein geänderter Listenvorlagencode:

Listeninhaltsvorlage (list.var)

$nomar=""; 
if($no%4==0){$nomar=" class=\"nomar\"";}else{$nomar="";} 
if($r[titlepic]){$tpic=sys_ResizeImg($r[titlepic],300,300,1,"");}else{$tpic="/e/data/images/notimg.gif";} 
$listtemp=&#39;<li&#39;.$nomar.&#39;><p class="photo"><img src="&#39;.$tpic.&#39;"><a href="[!--titleurl--]" rel="external nofollow" rel="external nofollow" rel="external nofollow" ><p class="txt"><h3>查看<br>详情</h3></p></a></p> 
<b><a href="[!--titleurl--]" rel="external nofollow" rel="external nofollow" rel="external nofollow" >[!--title--]([!--model--])</a></b> 
<a href="[!--titleurl--]" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="icon-thumbs-up" data-classid="[!--classid--]" data-id="[!--id--]"><em>[!--diggtop--]</em>人赞过</a></li>&#39;; 
最后在底部模板里或JS文件中加入以下js代码，大功告成
[html] view plain copy print?
<script type="text/javascript"> 
$(".icon-thumbs-up").click(function(event){ 
  event.preventDefault(); 
  var mythis = $(this); 
  var classid = mythis.data("classid"); 
  var id = mythis.data("id"); 
  $.ajax({ 
    type:"GET", 
    url:"[!--news.url--]e/public/digg/", 
    data:{"classid":classid,"id":id,"dotop":1,"doajax":1,"ajaxarea":"diggnum"}, 
    dataType:"text", 
    success:function(data){ 
      var reinfo = data.split("|"); 
      if (reinfo.length != 1) { 
        if (reinfo[0] != "") { 
          mythis.find("em").html(reinfo[0]); 
        } 
        if (reinfo[2] != "") { 
          //var left = parseInt(mythis.offset().left)+20, top = parseInt(mythis.offset().top); 
          var left = 20, top = mythis.find("em").get(0).offsetHeight; 
          $(".zan").remove(); 
          if (reinfo[2] == "谢谢您的支持") { 
            mythis.append(&#39;<p class="zan">+1 谢谢您的支持</p>&#39;); 
            //$("body").append(&#39;<p class="zan">+1 谢谢您的支持</p>&#39;); 
          }else{ 
            mythis.append(&#39;<p class="zan">已赞</p>&#39;); 
            //$("body").append(&#39;<p class="zan">已赞</p>&#39;); 
          } 
          //"text-shadow":"0 1px 0 rgba(0,0,0,0.5)","font-family":"simsun" 
          $(".zan").css({"position":"absolute","z-index":"10","left":left+"px","top":-top+"px","color":"inherit"}).animate({top:-top-30},"slow",function(){$(this).fadeIn("fast").remove();}); 
        } 
      }else{} 
    } 
  }); 
}); 
</script>

Nach dem Login kopieren

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie die obige Einführung gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Verwandte Lektüre:

So verwenden Sie Vue, um die Anmeldeüberprüfung zu implementieren

JS, um den Kalendereffekt eines nachgeahmten Fenstersystems zu implementieren

So verwenden Sie JS, um per Klick zum angemeldeten persönlichen Postfach zu springen

Das obige ist der detaillierte Inhalt vonSo fügen Sie die Like-Funktion zur Homepage-Listenseite von Empire CMS hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!