每个用户/浏览器会话仅显示欢迎div

我想每个用户或会话只显示一次欢迎div。我知道有Jquery选项。既然我是jquery的新手，我一直无法自己解决它。请帮助每个用户/浏览器会话仅显示欢迎div

$(document).ready(function() { 
 
    $("#close-welcome").click(function() { 
 
    $(".welcome").fadeOut(1000); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="welcome"> 
 
    <div> 
 
    <h1>Hello..!<br> Welcome to ABC 
 
    <br> 
 
    </h1> 
 
    <h2>We wish you a Great Day..!</h2> 
 
    <br> 
 

 
    <h2><a id="close-welcome" href="#">Thank you.. and please take me to the  website</a> </h2> 
 
    </div> 
 
</div>

我想只有一次显示此欢迎页面，直到用户关闭浏览器.. 等待有价值的帮助

来源

2013-05-03 Gops

如果您已经有登录系统将该信息附加到登录会话cookie，否则请仅使用mkhatib answer和cookie。另外请记住，服务器端http只有cookie更安全。 – 2013-05-03 08:28:52

设置cookie。

$(document).ready(function() { 
    if ($.cookie('noShowWelcome')) $('.welcome').hide(); 
    else { 
     $("#close-welcome").click(function() { 
      $(".welcome").fadeOut(1000); 
      $.cookie('noShowWelcome', true);  
     }); 
    } 
});

您需要包含jQuery.cookie JavaScript文件。

https://raw.githubusercontent.com/carhartl/jquery-cookie/master/src/jquery.cookie.js

来源

2013-05-03 08:16:04 mkhatib

嗨mkhatib，感谢您的更快的响应..我复制了脚本，并给予您指出的jquery.cookie.js的引用。然而，这同样是行不通的。我有没有想念什么..建议 – Gops 2013-05-03 08:34:38

我只注意到我的代码缺少'ready'函数的右括号。可能是这样。如果没有，你可以检查控制台，如果你有任何JavaScript错误？ – mkhatib 2013-05-03 17:59:19

这是控制台显示的错误未捕获的TypeError：对象函数（a，b）{返回新的e.fn.init（a，b，h）}没有方法'cookie' – Gops 2013-05-03 18:16:00

这是更好，因为我们将不会看到飞隐藏时闪烁

<a href="" id="close-edu" class="waves-effect"><span class="edu" style="display: none;">New</span></a>

jQuery的

$(document).ready(function() { 
    if ($.cookie('noShowEducation')) ; 
    else { 
     $('.edu').show(); 
     $("#close-edu").click(function() { 
      $(".edu").fadeOut(1000); 
      $.cookie('noShowEducation');  
     }); 

    } 
});

来源

2016-08-21 23:21:48

如果您的客户端不吃饼干

您可以使用sessionStorage，毕竟这是他们准确的意思，在整个会议期间保留一组数据。

为了获得最佳用户体验，您应该从现有CSS中的 [wellcomeElement] .style.display =“none”属性开始。

因此，整个过程会变得简单...

检查，如果欢迎消息已被证实
展！：不采取行动！

完成。

例如代码：

"message" in sessionStorage ? 0 : 
    [wellcomeElement].style.display = "block", 
    sessionStorage.setItem("message",true);

代码剪断可放，（但是多于优选地）在脚本标签的欢迎信息元素之后。

然而，对于完全向后兼容，你可以随时退回到使用会话名称属性为：

/message/.test(name) ? 0 : 
[wellcomeElement].style.display = "block", 
name = 'message';

问候。

来源

2016-12-10 04:28:33

每个用户/浏览器会话仅显示欢迎div

回答

相关问题