什么'这是一种基于if/if-else语句显示popover的简单方法

What's an easy way to show a popover based on if / if else statements?

本文关键字：if-else if 语句 显示 方法 简单 popover 一种 什么      更新时间：2024-05-30

我在我的网站上使用下面链接中的javascript。它确定用户1。已经允许我们的Facebook应用程序并已登录，2。尚未允许我们的应用程序，但已登录到Facebook或3。未登录到Facebook。

我想在我网站的一些内容上显示一个弹出窗口（可能是600px乘400px或其他），这样它就可以作为某种内容屏蔽器，告诉他们需要登录。然后，在他们允许应用程序后，弹出窗口就会消失。

我的问题是这个。如何在else-if-and-if语句中对弹出窗口进行编码？我可以做一些简单的事情，比如document.write（如我的代码中所示），但如何在我的内容上显示弹出窗口？有没有一种方法可以让我从这些语句中轻松地引用其他html和javascript？我甚至尝试过使用一个层，但它没有在我的内容上分层，而是将该层显示为一个新页面，而不显示页面的内容。

我的目标是在内容上显示一个弹出窗口，这样用户就可以看到它背后确实有内容，这样他们就更容易被说服允许该应用程序，这样他们就能看到所有内容。

FB.getLoginStatus(function(response) {
  if (response.status === 'connected') {
  document.write("<h1>Looks like you're logged into Facebook and our app :)</h1>  ");
    // the user is logged in and connected to your
    // app, and response.authResponse supplies
    // the user’s ID, a valid access token, a signed
    // request, and the time the access token 
    // and signed request each expire
    var uid = response.authResponse.userID;
    var accessToken = response.authResponse.accessToken;
  } else if (response.status === 'not_authorized') {
  document.write("<h1>Logged in but haven't allowed our app</h1>  ");
    // the user is logged in to Facebook, 
    //but not connected to the app
  } else {
  document.write("<h1>Not logged in</h1>");
    // the user isn't even logged in to Facebook.
  }
});

http://pastebin.com/J882yh5F

只需CSS就可以轻松完成这项工作。在body级别创建一个div，并设置为position: absolute，宽度和高度为100%，另一个内部div作为具有自己维度的警报消息。然后，您可以使用JavaScript中的简单display: none或display: block来显示或隐藏自定义消息。

演示：http://codepen.io/elclanrs/full/rGoha

相关文章：