简单Cookie同意-如何评估用户是否已经点击并同意

Question

有人告诉我要向网站添加cookie。除了访问量以外，该网站不保留任何用户信息。

因此，我没有任何用户数据可将cookie分配给它，因此无法确定用户是否已接受。

使答案尽可能快地实施并使用简单的代码，是否可以将cookie只显示给尚未确认的用户？

我在这里。 “将在每次页面加载时显示的基本Cookie策略”。请帮助我使它仅对每个用户显示一次。

	$(document).ready(function(){
		if(getCookie("HideCookie") != "true") {
			$("#cookie-consent").css('display','block');
		}
	});

	function SetCookieAndHideDiv(){
		setCookie('HideCookie','true',1);
		$("#cookie-consent").css('display','none');
	}

	function getCookie(cname) {
		var name = cname + "=";
		var ca = document.cookie.split(';');

		for(var i=0; i<ca.length; i++) {
			var c = ca[i];
			while (c.charAt(0)==' ') c = c.substring(1);
			if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
		}

		return "";
	}

	function setCookie(cname, cvalue, exdays) {
		var d = new Date();
		d.setTime(d.getTime() + (exdays*24*60*60*1000));
		var expires = "expires="+d.toUTCString();
		document.cookie = cname + "=" + cvalue + "; " + expires;
	}

	/* COOKIE */
	#cookie-consent {
        display: none;

		width:100%;
		height: 100%;

		position:fixed;
		bottom:0px;

		background-color: rgba(0,0,0,0.8);

		z-index: 100000;
	}

		.cookie-consent-inner {
			width:100%;

			padding: 20px;

			position:fixed;
			bottom:0px;

			background-color: rgba(0,74,119,1);
			color: rgba(255,209,0,1);
		}

			.cookie {
				width: 100%;
				max-width: 1248px;
				margin: 0 auto;

				display: -webkit-flex;
				-webkit-flex-wrap: wrap;
				display: flex;
				flex-wrap: wrap;
				align-items: center;
			}

				.cookie-msg {
					width: calc(100% - 120px);
					margin-right: 20px;
					float: left;
				}
				.cookie-accept {
					width: 100px;
					float: right;
				}
					.cookie-button {
						font-size: 16px;
						line-height: 40px;
						padding: 0px;
						color: #FFD100;
						width: 100px;
						background-color: #337ab7;
						cursor: pointer;
						border: 1px solid white!important;
						-o-transition: all 0.4s linear;
						-moz-transition: all 0.4s linear;
						-ms-transition: all 0.4s linear;
						-webkit-transition: all 0.4s linear;
						transition: all 0.4s linear;
						text-align: center;
					}
						.cookie-button:hover {
							background-color: #0072AE;
						}
	/* END COOKIE */

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<section id="cookie-consent" class="cookie-consent">
	<div class="cookie-consent-inner">
		<div class="cookie">

			<div class="cookie-msg">We use cookies to track visits to our website, we store no personal details. By staying on the site you consent to our cookie policy.</div>
			<div class="cookie-accept">
				<button id="cookie" class="cookie-button" onclick='SetCookieAndHideDiv();'>OK</button>
			</div>
			
		</div>
	</div>
</section>

我知道这是非常基本的，但是有基本需求。

Answer 1

感谢所有评论-很高兴获得了一定的关注。

请投票表决该问题，以便其他人可以获取此代码。

工作代码：

    $(document).ready(function(){
		if(getCookie("HideCookie") != "true") {
			$("#cookie-consent").css('display','block');
		}
	});

	function SetCookieAndHideDiv(){
		setCookie('HideCookie','true',1);
		$("#cookie-consent").css('display','none');
	}

	function getCookie(cname) {
		var name = cname + "=";
		var ca = document.cookie.split(';');

		for(var i=0; i<ca.length; i++) {
			var c = ca[i];
			while (c.charAt(0)==' ') c = c.substring(1);
			if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
		}

		return "";
	}

	function setCookie(cname, cvalue, exdays) {
		var d = new Date();
		d.setTime(d.getTime() + (exdays*24*60*60*1000));
		var expires = "expires="+d.toUTCString();
		document.cookie = cname + "=" + cvalue + "; " + expires;
	}

	/* COOKIE */
	#cookie-consent {
        display: none;

		width:100%;
		height: 100%;

		position:fixed;
		bottom:0px;

		background-color: rgba(0,0,0,0.8);

		z-index: 100000;
	}

		.cookie-consent-inner {
			width:100%;

			padding: 20px;

			position:fixed;
			bottom:0px;

			background-color: rgba(0,74,119,1);
			color: rgba(255,209,0,1);
		}

			.cookie {
				width: 100%;
				max-width: 1248px;
				margin: 0 auto;

				display: -webkit-flex;
				-webkit-flex-wrap: wrap;
				display: flex;
				flex-wrap: wrap;
				align-items: center;
			}

				.cookie-msg {
					width: calc(100% - 120px);
					margin-right: 20px;
					float: left;
				}
				.cookie-accept {
					width: 100px;
					float: right;
				}
					.cookie-button {
						font-size: 16px;
						line-height: 40px;
						padding: 0px;
						color: #FFD100;
						width: 100px;
						background-color: #337ab7;
						cursor: pointer;
						border: 1px solid white!important;
						-o-transition: all 0.4s linear;
						-moz-transition: all 0.4s linear;
						-ms-transition: all 0.4s linear;
						-webkit-transition: all 0.4s linear;
						transition: all 0.4s linear;
						text-align: center;
					}
						.cookie-button:hover {
							background-color: #0072AE;
						}
	/* END COOKIE */

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<section id="cookie-consent" class="cookie-consent">
	<div class="cookie-consent-inner">
		<div class="cookie">

			<div class="cookie-msg">We use cookies to track visits to our website, we store no personal details. By staying on the site you consent to our cookie policy.</div>
			<div class="cookie-accept">
				<button id="cookie" class="cookie-button" onclick='SetCookieAndHideDiv();'>OK</button>
			</div>
			
		</div>
	</div>
</section>