Ajax可以更新动态导航菜单吗

Can Ajax update a dynamic navigation menu?

本文关键字：导航 菜单 动态 更新 Ajax      更新时间：2023-09-26

我正在使用一个PHP函数来确定显示的链接：

<?php
  //amend toplinks if logged in
  if($general->loggedIn()){ ?>
    <nav class = "memberHeaderArea">
      <ul>
        <li>
          <a href="userProfile.php?username=<?php echo $user['username'];?>">Profile<span class="user icon"></span></a>
        </li>
        <li>
          <a href="userLogout.php">Log out<span class="lock icon"> </span></a>
        </li>
      </ul>
    </nav>
  <?php
    //toplinks for when not logged in
  }else{ ?>

我刚刚更改了登录结构以使用Ajax，除了导航之外，它运行得很好。在调用页面刷新之前，它仍然显示登录/注册。显然，使用Ajax的原因是为了避免页面刷新，但有没有办法在success函数中更新这些链接？

success: function(data) {
  $("#statusLogin").hide();
  if(data.success == true){
    $('#loginContent').slideToggle();
  }else{
    // alert("data.message... " + data.message);//undefined
    $("#error").show().html(data.message);
  }

根据我的发现，我可能需要分配nav的id，然后使用Ajax/jQuery来确定目标。但我不知道怎么做。非常感谢您的帮助。

这是在页面加载后用AJAX检查登录状态的基本（也是伪）东西。也许你想要比if(true)和echo调用更严肃的检查，但它会是这样的：）检查下面的fiddle，这样你也可以看到html和css。。。

$.getJSON('/echo/json/').done(function (data) {
    console.log("Call returned");
    if (true){
        //successful login
        $('#loggedin').slideToggle();
    }else {
        //unsuccessful login
        $('#login').slideToggle();
    }
}).fail(function (data) {
    console.log("Call failed");
    $('#login,#error').slideToggle();
}).always(function (data) {
    console.log("Always running");    
});

JSFiddle

相关文章：