JS utilise des cookies pour réaliser la méthode d'affichage de la boîte d'invite DIV uniquement une fois

JS utilise des cookies pour réaliser la méthode d'affichage de la boîte d'invite DIV uniquement une fois_javascript skills

WBOY

Libérer： 2016-05-16 15:33:43

original

1257 Les gens l'ont consulté

L'exemple de cet article décrit comment JS utilise les cookies pour afficher la boîte d'invite DIV une seule fois. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

La technologie des cookies JavaScript est utilisée ici pour contrôler que l'invite DIV sur la page Web ne soit affichée qu'une seule fois, c'est-à-dire qu'elle s'affiche lorsque l'utilisateur ouvre la page Web pour la première fois et est automatiquement masquée la deuxième fois, ce qui améliore grandement l’expérience utilisateur. Cela ne gênera pas les utilisateurs ; nous pouvons faire beaucoup de choses en utilisant les cookies, faisons-en l’expérience lentement.

La capture d'écran de l'effet en cours d'exécution est la suivante :

L'adresse de la démo en ligne est la suivante :

http://demo.jb51.net/js/2015/js-cookie-div-dlg-show-once-codes/

Le code spécifique est le suivant :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>cookie，只显示一次的DIV提示框</title>
<style>
.note{height:100px;width:600px;background:url(images/tishi.jpg) #FEFFCF 40px 0px no-repeat;border:#EDCE7B 1px solid;}
.guanbi{float:right;font-size:12px;padding:6px;}
</style>
<script>
function cookiesave(n, v, mins, dn, path)
{
 if(n)
 {
  if(!mins) mins = 365 * 24 * 60;
  if(!path) path = "/";
  var date = new Date();
  date.setTime(date.getTime() + (mins * 60 * 1000));
  var expires = "; expires=" + date.toGMTString();
  if(dn) dn = "domain=" + dn + "; ";
  document.cookie = n + "=" + v + expires + "; " + dn + "path=" + path;
 }
}
function cookieget(n)
{
 var name = n + "=";
 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,c.length);
  if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
 }
 return "";
}
function closeclick(){
 document.getElementById('note').style.display='none';
 cookiesave('closeclick','closeclick','','','');
}
function clickclose(){
 if(cookieget('closeclick')=='closeclick'){
  document.getElementById('note').style.display='none';
 }else{
  document.getElementById('note').style.display='block';
 }
}
window.onload=clickclose;
</script>
</head>
<body>
<div id="note" class="note" style="display:none;">
 <div><a href="#" onclick="closeclick()" class="guanbi"><img src="images/close-note.gif" border="0" /></a></div>
</div>
</body>
</html>

Copier après la connexion

J'espère que cet article sera utile à tout le monde dans la programmation JavaScript.