如何在 html 或 Javascript 中创建“首次加载”事件?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19474200/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I create a "first-load" event in html or Javascript?
提问by UserMat
I'm starter. I have an idea. I want to implement an event like this. Is it possible?
我是首发 我有个主意。我想实现这样的事件。是否可以?
<html>
<head>
<title>First visit event</title>
<script>
function do_something()
{
alert("Hello my friend. This is your first visit.");
}
</script>
</head>
<body firstVisitEvent="do_something()">
</body>
采纳答案by UserMat
Use on load. It will execute when the page loads, and you will see your alert. Good luck with your knowledge.
负载时使用。它将在页面加载时执行,您将看到您的警报。祝你的知识好运。
<html>
<head>
<script>
function load()
{
alert("Page is loaded");
}
</script>
</head>
<body onload="load()">
<h1>Hello World!</h1>
</body>
</html>
Edit: You can get more advance and set cookies to see if it's the user's first time, but I'm not sure you're at that level yet, but anyways:
编辑:您可以获得更多信息并设置 cookie 以查看它是否是用户的第一次,但我不确定您是否处于该级别,但无论如何:
You could for example set a localStorage property like
例如,您可以设置一个 localStorage 属性,例如
if(!localStorage["alertdisplayed"]) {
alert("Your text")
localStorage["alertdisplayed"] = true
}
Note that localStorage isn't supported by older Browsers.
请注意,较旧的浏览器不支持 localStorage。
An alternative would be setting a Cookie and check against its existence
另一种方法是设置 Cookie 并检查其是否存在
If you don't know how to set / get cookies with javascript, i would suggest, reading this article: https://developer.mozilla.org/en-US/docs/Web/API/document.cookie?redirectlocale=en-US&redirectslug=DOM%2Fdocument.cookie
如果您不知道如何使用 javascript 设置/获取 cookie,我建议您阅读这篇文章:https: //developer.mozilla.org/en-US/docs/Web/API/document.cookie?redirectlocale=en -US&redirectslug=DOM%2Fdocument.cookie
回答by Dan Coates
Localstorage is probably the way to go. Here is a bit of info on it: http://diveintohtml5.info/storage.html
本地存储可能是要走的路。这里有一些关于它的信息:http: //diveintohtml5.info/storage.html
Basically it allows you to store small amounts of data on the user's machine (up to 5mb in most browsers). So all you need to do is set a flag in there letting you know that the user has already visited, and if that flag isn't present on page load, show the message.
基本上它允许您在用户的机器上存储少量数据(在大多数浏览器中最多 5mb)。所以你需要做的就是在那里设置一个标志,让你知道用户已经访问过,如果页面加载时没有该标志,则显示消息。
// Run function on load, could also run on dom ready
window.onload = function() {
// Check if localStorage is available (IE8+) and make sure that the visited flag is not already set.
if(typeof window.localStorage !== "undefined" && !localStorage.getItem('visited')) {
// Set visited flag in local storage
localStorage.setItem('visited', true);
// Alert the user
alert("Hello my friend. This is your first visit.");
}
}
This should work in all browsers where local storage is available. See caniuse.com for reference. http://caniuse.com/#search=localstorage
这应该适用于本地存储可用的所有浏览器。请参阅 caniuse.com 以供参考。 http://caniuse.com/#search=localstorage
回答by Vicky Gonsalves
you can do it for chrome in following way
您可以通过以下方式为 chrome 执行此操作
<html>
<head>
<title>First visit event</title>
<script>
function do_something() {
if(typeof(localStorage.setVisit)=='undefind' || localStorage.setVisit==''){
localStorage.setVisit='yes';
alert("Hello my friend. This is your first visit.");
}
}
</script>
</head>
<body onload="do_something()"> </body>
回答by m3h2014
You have a couple of options: storing a cookie on the client or utilizing the local storage of html5. Either of these could be checked on page load.
您有两种选择:在客户端存储 cookie 或利用 html5 的本地存储。可以在页面加载时检查其中任何一个。
Here is a link for getting started with HTML5 web storage:
这是 HTML5 网络存储入门的链接:
回答by marcorchito8
Since working with localStorage can be tedious because of operators and function names, to simplify you can use the in operator to check if a key exists:
由于操作符和函数名的原因,使用 localStorage 可能会很乏味,为了简化您可以使用 in 操作符来检查键是否存在:
window.onload = function () {
if(!('hasThisRunBefore' in localStorage)) {
/** Your code here... **/
localStorage.setItem("hasThisRunBefore", true);
}
}