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


jQuery .show() not working until a refresh is made

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

该功能在每一页中都包含的标题中(我在有问题的页面的标题中尝试过,结果相同。

id loggedIn被设置为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);
    }
});
}

再次感谢,这已经困扰了我很长时间了,尽管尝试了很多次,但我还没有找到解决它的方法

EDIT:登录功能

public function loggedIn(){
return (isset($_SESSION['id'])) ? true : false;
}//end function
$(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,它将根据参数中传递的间隔值继续执行函数。这样,如果此脚本在您的所有页面上运行,则用户的所有页面在登录/注销时都将自动更新,而不仅仅是触发登录事件的页面。

这种情况很可能是由于浏览器将脚本缓存在脚本标记中(以及其全局变量)。

您可以做的是从外部引用脚本,然后在脚本后面附加一些总是变化的随机字符串。

<script src="myscript.php?randomkey=<?php echo date("U"); ?>">
</script>

myscript.php的内容就是您的代码。

这样,浏览器就会不断地被引导相信脚本已经更改。请记住,myscript.php广播的头mime类型必须是text/javascript,以确保它在所有浏览器中都能工作。

我知道这可能不是最干净的解决方案,但它应该可以正常工作。