更改导航栏登录下拉菜单以注销ajax [英] Change navbar login dropdown to logout ajax

问题描述

我正在尝试找出用户登录后如何通过ajax(不刷新页面)更改引导导航栏下拉菜单.谢谢

<ul class="nav navbar-nav" name= "myNavBar" id="myNavbar">
    <li><a href="/about/">About</a></li>
    <li><a href="/contact/">Contact Us</a></li>
    <li><a href="/blog/">Blog</a></li>
    <li><a href="/webstore/FiberArts/">Store</a></li>
    <li class="dropdown">
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Login | Register<b class="caret"></b></a>
        <ul class="dropdown-menu">
            <li><a data-toggle="modal" data-target="#myOtherModal" href="#log-in">Login</a></li>
            <li class="divider"></li>
            <li><a data-toggle="modal" data-target="#myModal" href="#log-in">Register</a></li>
    </li>
</ul>

我可以更改它，但需要刷新页面

在单击对话框中的

解决方案

后，单击登录/reg链接，然后单击登录按钮，就可以像使用jquery一样进行操作

$.ajax({ ..... success: { $('.dropdown').hide(); }

然后显示或附加注销链接.

如果您从未使用过jquery ajax，请 jquery ajax示例

I am trying to figure out how to change a bootstrap navbar dropdown via ajax(without page refresh) after the user logs in. Thanks

<ul class="nav navbar-nav" name= "myNavBar" id="myNavbar">
    <li><a href="/about/">About</a></li>
    <li><a href="/contact/">Contact Us</a></li>
    <li><a href="/blog/">Blog</a></li>
    <li><a href="/webstore/FiberArts/">Store</a></li>
    <li class="dropdown">
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Login | Register<b class="caret"></b></a>
        <ul class="dropdown-menu">
            <li><a data-toggle="modal" data-target="#myOtherModal" href="#log-in">Login</a></li>
            <li class="divider"></li>
            <li><a data-toggle="modal" data-target="#myModal" href="#log-in">Register</a></li>
    </li>
</ul>

I can get it to change but it requires page refresh

解决方案

from the modal dialog after it appears from clicking the login/reg links, on login button click, you'd just do something like using jquery

$.ajax({ ..... success: { $('.dropdown').hide(); }

then show or append a log out link.

if you've never used jquery ajax, jquery ajax example

这篇关于更改导航栏登录下拉菜单以注销ajax的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！