php - jQuery .show() 在刷新之前不起作用

Question

我有一个 jQuery 函数来根据用户是否登录来显示各种内容。

该函数位于每个页面中包含的标题中(我在相关页面的标题中尝试了它，结果相同。

idloggingIn设置为display:none，jquery应该在登录后显示它，但它永远不会显示。

我已经对loggedIn和loggedOut进行了测试，但都没有出现，但是头部确实更新了链接，尽管是在刷新之后，这是另一个问题。
在标题中，我必须在链接更改之前刷新页面。

非常感谢您的帮助。

<script>
$(document).ready(function () {
    var loggedIn = <? php echo json_encode($general - > loggedIn()); ?> ;
    if (loggedIn == true) {
        $("#loggedIn").show();
    } else {
        $("#loggedOut").show();
    }
});            
</script>

以下代码中不会显示loggedIn 或loggedOut 元素。

<p id="loggedOut">YOOOOHOOOOOOO</p>
  </div>

<?php

 $body = <<<EOT
        <div class="viewAndDownload" id="loggedIn">
            <a href="../download.php?filename=bla.pdf">Click to download the PDF/>
</div>
EOT;

这是标题中的 HTML，其中登录框只有在刷新后才会显示:

<nav class = "memberHeaderArea" id="loggedIn">
    Links Here
</nav>

<nav class = "memberHeaderArea" id ="loggedOut">
 Removed links etc to save space
<input type="submit" name="loginButton" id="loginButton" value="Login!"   onclick="validLogin(); return false;"/>

onclick调用ajax函数

function validLogin(){

//removed get username etc

var params = {username: username, password: password};
var url = "../loginProcessAjax.php";

$("#statusLogin").show();

$.ajax({
    type: 'POST',
    url: url,
    data: params,
    dataType: 'json',
    beforeSend: function() {
      document.getElementById("statusLogin").innerHTML= '<img src="../images/loginLoading.gif" /> checking...' ;
    },

    success: function(data) {

        $("#statusLogin").hide();

        if(data.success == true){

            //$('#loggedIn').show();
            $('#loginContent').slideToggle();
            //$('#loggedOut').hide();

        }else{
           // alert("data.message... " + data.message);//undefined
            $("#error").show().html(data.message);
        }

    },
    error: function( error ) {
        console.log(error);
    }
});
}

再次感谢您，这个问题困扰了我很多年，尽管我尝试了很多次，但还是没有找到解决的方法

编辑:登录功能

public function loggedIn(){

return (isset($_SESSION['id'])) ? true : false;
}//end function

Answer 1

$(document).ready(function(){
    function testLoggedIn(){
      var loggedIn = <? php echo json_encode($general - > loggedIn()); ?> ;
        if (loggedIn == true) {
          $("#loggedIn").show();
        } else {
          $("#loggedOut").show();
        }
    }

    setInterval(testLoggedIn(),1000);
});

像这样的东西应该可以工作。

编辑主要思想是您必须不断检查用户是否登录，而不仅仅是文档准备就绪。要实现这一点，您可以使用 setInterval ，它将根据参数中传递的间隔值继续执行该函数。这样，如果此脚本在您的所有页面上运行，则用户登录/注销时的所有页面都会自动更新，而不仅仅是他触发登录事件的页面。