【问题标题】:document.getElementById("").style.display='none'; is not workingdocument.getElementById("").style.display='none';不管用
【发布时间】:2020-04-09 00:16:26
【问题描述】:

我试图在用户登录时隐藏此登录/注册导航元素,但它不起作用。

<nav id="nav">
    <ul>
        <li><a href="index.html">Home</a>
            <ul>
                <li><a href="#banner" class="scrolly">Who are we</a></li>
                <li><a href="#main" class="scrolly">Our Events</a></li>
                <li><a href="#features" class="scrolly">Our Story</a></li>
                <li><a href="#footer" class="scrolly">Contact Us</a></li>
            </ul>
        </li>
        <li><a>Events</a>
            <ul>
                <li><a href="CurrentEvents.html" class="scrolly">Current Events</a></li>
                <li><a href="#main" class="scrolly" id = "myevents">My Events</a></li>
            </ul>
        </li>
        <li><a>Account</a>
            <ul>
                <li id = "Login/Register"><a href="LoginRegister.html" class="scrolly">Login/Register</a></li> 
                <li><a href="LoginRegister.html" class="scrolly" id = "userLoggedIn ">Abdalla</a></li>
                <li><a href="#footer" class="scrolly">Settings</a></li>
                <li id = "logout" onclick="logout()">Log out</li>
            </ul>
        </li>                       
    </ul>
</nav>

JS:

firebase.auth().onAuthStateChanged(function(user) {

    if (user) {
      document.getElementById("Login/Register").style.display='none';
    } else {
      document.getElementById("logout").style.display="none";
    }
  }
);

函数被正确调用,我测试了它并且 我尝试隐藏其他随机元素,例如标题,它起作用了。它根本不适用于这些导航元素。我尝试了其他方法,我也尝试了 jQuery,我尝试删除整个元素,但没有任何反应。它没有返回 NULL,它没有给我一个错误,但它根本行不通。难道我做错了什么?另外,这是用户登录时做事的正确方法吗?只是为了隐藏某些元素?还是有更好的方法来做到这一点。我是网络开发新手,我不确定这是否是最佳方式,所以我愿意接受建议。

【问题讨论】:

  • 您确定没有多个具有“登录/注册”ID 的元素吗?
  • console.log( document.getElementById("Login/Register") ) 并查看元素是否正确选择。如果存在多个具有相同 id 的元素,那么这将显示错误的选择器
  • 从您提供的信息来看,它似乎可以正常工作,您能否确保您的所有 id 都是唯一的并且正确调用了 .onAuthStateChanged(function(user) { 函数。
  • user 可能是错误的。以undefined 为例。
  • 请检查以下情况:检查 onAuthStateChanged 方法是否正在执行,尝试将 'console.log(user)' 放入其中,以确保用户对象返回正确的值,然后检查文档对象是否返回您指定的 ID 的最后一件事

标签: javascript html css firebase firebase-authentication


【解决方案1】:

当用户是 已登录但无法使用。

你确定不想要这个

 firebase.auth().onAuthStateChanged(function(user) {
   if (!user) {
     document.getElementById("Login/Register").style.display = '';
     document.getElementById("logout").style.display = "none";
   } else {
     document.getElementById("Login/Register").style.display = 'none';
     document.getElementById("logout").style.display = "";
   }
 });

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-08-31
    • 2021-05-18
    • 1970-01-01
    • 2021-04-11
    • 2021-11-07
    • 1970-01-01
    • 2012-11-21
    • 2014-11-18
    相关资源
    最近更新 更多