JSFiddle - React, Tailwind, and code Playground

by huppen

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/js-cookie/2.1.4/js.cookie.js"></script>
<input id="tracking" type="checkbox" name="tracking" value="1" disabled> Trackingstatus
<br>
<br>
<div id="message"></div>
<br>
<button class="yes">Ja</button>
<button class="no">Nein</button>
<br>
<br>
<button class="run">Run again</button>
<button class="clearcookie">Gesetzte Cookies löschen</button>

JavaScript

//set cookie and check
$(document).ready(function() {
	var cookiecon = Cookies.get('option');
  
  if (cookiecon == 'true') {
    $("#message").text("Tracking akzeptiert. Cookie aktiv.")
    $("#tracking").prop('checked', true);
    //alert('Cookie found.');
  }
  else if (cookiecon == 'false')
  {
  	$("#message").text("Kein Tracking akzeptiert. Cookie inaktiv.")
       $("#tracking").prop('checked', false);
      //alert('Cookie found.');
  }
  else
  {
  	$("#message").text("Stimmst du dem bösen Tracking zu?")
  }
  
  $('.yes').click(function() {
    $("#message").text("Du stimmst dem Tracking zu HARHARHAR -> Run again.")
    $("#tracking").prop('checked', true);
 		Cookies.remove('option');
		Cookies.set('option', 'true', { expires: 14 });
  });

  $('.no').click(function() {
    $("#message").text("Du stimmst dem Tracking nicht zu WHAAAT?! -> Run again.")
    $("#tracking").prop('checked', false);
		Cookies.remove('option');
		Cookies.set('option', 'false', { expires: 14 });


  });

  $('.clearcookie').click(function() {
    $("#message").text("Cookies gelöscht. -> Run again.")
		Cookies.remove('option');
  });
  
  $('.run').click(function() {
		location.reload();
  });


});