hlmod.hu
https://hlmod.hu/

HTML Click counter
https://hlmod.hu/viewtopic.php?f=114&t=27349		 Oldal: 1 / 1
Szerző:  *GrafitY* [ 2017.02.27. 19:48 ]
Hozzászólás témája:  HTML Click counter
Sziasztok!
HTML-ben lennék kíváncsi, hogy ez a kód elmenti a számozást mindenkinek az oldalon, vagy csak az adott böngészőben? Nekem úgy kellene, ha pl én rá klikkelek 1x, azt menti, és mikor más valaki bárhol a világon rákattint akkor folytassa a számlálást, amit mindenkinek megjelenít az oldalon, és így tovább.

KÓD:
Kód: [Egész kijelölése] [Mutatás/Eltüntetés]
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <script>
  5. function clickCounter() {
  6.     if(typeof(Storage) !== "undefined") {
  7.         if (localStorage.clickcount) {
  8.             localStorage.clickcount = Number(localStorage.clickcount)+1;
  9.         } else {
  10.             localStorage.clickcount = 1;
  11.         }
  12.         document.getElementById("result").innerHTML = "You have clicked the button " + localStorage.clickcount + " time(s).";
  13.     } else {
  14.         document.getElementById("result").innerHTML = "Sorry, your browser does not support web storage...";
  15.     }
  16. }
  17. </script>
  18. </head>
  19. <body>
  20. <p><button onclick="clickCounter()" type="button">Click me!</button></p>
  21. <div id="result"></div>
  22. <p>Click the button to see the counter increase.</p>
  23. <p>Close the browser tab (or window), and try again, and the counter will continue to count (is not reset).</p>
  24. </body>
  25. </html>
GeSHi © Codebox Plus
Szerző:  CrB [ 2017.03.04. 07:54 ]
Hozzászólás témája:  Re: HTML Click counter
Nem ez a kód nem fogja elmenteni. A javascript egy kliens oldali programozasi nyelv igy minden ami az oldalon történik a kliens gépén fut le. Ahhoz hogy a kattintasokat el tudd menteni szerver oldali prog nyelvre van szükség ilyen pl a PHP, ezen kívül a szerveren is kell tárolnod ehhez vagy fájlt vagy adatbázist használhatsz.
Szerző:  *GrafitY* [ 2017.03.04. 15:29 ]
Hozzászólás témája:  Re: HTML Click counter
CrB írta:
Nem ez a kód nem fogja elmenteni. A javascript egy kliens oldali programozasi nyelv igy minden ami az oldalon történik a kliens gépén fut le. Ahhoz hogy a kattintasokat el tudd menteni szerver oldali prog nyelvre van szükség ilyen pl a PHP, ezen kívül a szerveren is kell tárolnod ehhez vagy fájlt vagy adatbázist használhatsz.


Egy ilyen kódot tudnál küldeni? Vagy hol találok ilyet, amit ki tudok íratni html-re, pl arra amit én küldtem?
Az én esetemben arra csatolni azt, amit te írtál, ahhoz amit én küldtem.

Szerkesztve:
Találtam egy kódot, ez nem tudom, hogy olyan lenne [profil]CrB[/profil]?

HTML:
Kód: [Egész kijelölése] [Mutatás/Eltüntetés]
  1. <html>
  2.     <head>
  3.     <script type="text/javascript">
  4.     function getVote(int)
  5.     {
  6.     if (window.XMLHttpRequest)
  7.       {// code for IE7+, Firefox, Chrome, Opera, Safari
  8.       xmlhttp=new XMLHttpRequest();
  9.       }
  10.     else
  11.       {// code for IE6, IE5
  12.       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  13.       }
  14.     xmlhttp.onreadystatechange=function()
  15.       {
  16.       if (xmlhttp.readyState==4 && xmlhttp.status==200)
  17.        {
  18.        document.getElementById("poll").innerHTML=xmlhttp.responseText;
  19.         }
  20.       }
  21.     xmlhttp.open("GET","poll_vote.php?vote="+int,true);
  22.     xmlhttp.send();
  23.  
  24.  
  25.     if(typeof(Storage)!=="undefined")
  26.       {
  27.       if (localStorage.clickcount)
  28.         {
  29.         localStorage.clickcount=Number(localStorage.clickcount)+1;
  30.         }
  31.       else
  32.         {
  33.         localStorage.clickcount=1;
  34.         }
  35.       document.getElementById("result").innerHTML="You have voted " + localStorage.clickcount + " times before this session";
  36.       }
  37.     else
  38.       {
  39.       document.getElementById("result").innerHTML="Sorry, your browser does not support web storage...";
  40.       }
  41.     }
  42.  
  43.     </script>
  44.  
  45.     </head>
  46.     <body bgcolor=#5D003D>
  47.     <div id="poll">
  48.  
  49.     <p>Click the button to see the counter increase.</p>
  50.     <p>Close the browser tab (or window), and try again, and the counter will continue to count (is not reset).</p><form>
  51.     <input type="Button" class="voteButton" name="vote" value="Vote" onclick="getVote(this.value)" />
  52.     </form>
  53.     </div>
  54.     </body>
  55.     </html>
GeSHi © Codebox Plus


PHP:
Kód: [Egész kijelölése] [Mutatás/Eltüntetés]
  1. <?php
  2. $vote = $_REQUEST['vote'];
  3.  
  4. //get content of textfile
  5. $filename = "poll_result.txt";
  6. $content = file($filename);
  7.  
  8. //put content in array
  9. $array = explode("||", $content[0]);
  10. $yes = $array[0];
  11. $no = $array[1];
  12.  
  13. if ($vote == 0)
  14.   {
  15.   $yes = $yes + 1;
  16.   }
  17. if ($vote == 1)
  18.   {
  19.   $no = $no + 1;
  20.   }
  21.  
  22. //insert votes to txt file
  23. $insertvote = $yes;
  24. $fp = fopen($filename,"w");
  25. fputs($fp,$insertvote);
  26. fclose($fp);
  27. ?>    
  28. <table>
  29. <tr>
  30. <td><div id="votesMsg">Total Votes  :</div></td>
  31. <td><div id="votesCounter">
  32. <?php echo($yes); ?></div>
  33. </td>
  34. </tr>
  35. </table>
  36. <input type="Button" class="voteButton" name="vote" value="Vote again !!!" onclick="getVote(this.value)" />
GeSHi © Codebox Plus
Szerző:  Silent [ 2017.03.17. 17:38 ]
Hozzászólás témája:  Re: HTML Click counter
Hülye vagy mint szódás a lovát :D Na nézzük..


A HTML egy markup nyelv, a JavaScript pedig egy tipustalan, igénytelen webprogramozási nyelv, amit a kliens böngésző dolgoz fel teljes mértékben és a szervernek abszolút semmi köze hozzá, így amit változtatsz, az mások számára nem fog változni.

Ergó, össze kell kötnöd a klienst a szerverrel:

Kliens => HTTP Kérés => Feldolgozó egység a szerveren => Tároló

Vegyük sorra. A kliensed itt a böngésző. A HTTP kérést többféle módon executolhatod (jQuery $.post/get/stb.. promise, angular $http promise stb, AJAX stb [Ezek a leggyakrabban használtak])

Tehát a HTTP kérésben elküldtél egy adatot (általában egy objektumot [pl. json]) a feldolgozóegységednek.
Ez lehet akár egy szimpla PHP fájl, egy komplett PHP Framework (pl. Laravel, CodeIgniter) vagy akár más nyelven íródott restful API-k (pl. Java).

Ez az egységed feldolgozza az adatot és elmenti a tárolóba, ami lehet adatbázis (pl. postgreSQL, MariaDB etc) vagy akár fájl.

Ha valamelyik része nem vili, feel free to ask.
Oldal: 1 / 1 Minden időpont UTC+02:00 időzóna szerinti
Powered by phpBB® Forum Software © phpBB Limited
https://www.phpbb.com/