jQuery .show()在刷新之前无法工作

时间:2013-07-26 10:47:48

标签: php javascript jquery html ajax

我有一个jQuery函数来显示各种内容,具体取决于用户是否登录。

该功能位于每个页面中都包含的标题中(我在相关页面的头部尝试了相同的结果。

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

我已经使用loggedIn和loggedOut进行了测试,但是出现了nether,但是头部会更新链接,尽管刷新后这是另一个问题。
在标题中,我必须在链接更改之前刷新页面。

感谢任何帮助。

<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

2 个答案:

答案 0 :(得分:1)

这很可能是由于浏览器在脚本标记内缓存了脚本(以及它的全局变量)。

你可以做的是从外部引用脚本,然后在它后面追加一些随时变化的字符串。

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

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

这样,浏览器将不断被认为脚本已经改变。请注意,myscript.php广播的标头mime-type必须为text/javascript,以确保其适用于所有浏览器。

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

答案 1 :(得分: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,它将根据参数中传递的间隔值继续执行函数。这样,如果此脚本在您的所有页面上运行,则用户的所有页面将在他登录/注销时自动更新,而不仅仅是他触发登录事件的页面。