Question

我正在用HTML子节点创建一个树...

当点击同一个LI上的A标签时，我需要显示/隐藏UL。

在以下示例中，当单击带有3的A标记时，包含3.1和3.2的UL应显示/隐藏。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li>
   <a href="#">3</a>
   <ul> 
     <li><a href="#">3.1</a></li>
     <li><a href="#">3.2</a></li>
   </ul>          
</ul>

public string GetAuthenticationUrl(string context, string redirectUrl)
{
        if(context == null)
            throw new ArgumentException(nameof(context));
        if (string.IsNullOrEmpty(redirectUrl))
            throw new ArgumentException(nameof(redirectUrl));

        var appContext = _applicationContextProvider.GetLinkedInApplicationContext();
        var linkedIn = new UserAgentClient(new AuthorizationServerDescription
        {
            TokenEndpoint = new Uri(appContext.AccessTokenEndpoint),
            AuthorizationEndpoint = new Uri(appContext.AuthorizationEndpoint),
            ProtocolVersion = ProtocolVersion.V20
        }, appContext.ClientId, appContext.ClientSecret);

        var target = linkedIn.RequestUserAuthorization(null, context, new Uri(redirectUrl));

        return target.AbsoluteUri;
    }

注意：目前我在点击时使用“a”但它应该只是在同一个LI上有UL的A标签。

Answer 1

//bind only on the 'a's that have a sibling 'ul'
$("a").filter(function(){
    return ( $(this).siblings('ul').length > 0 );
}).on("click", function(e) {
    e.preventDefault();
    // hide sibling ul element (if it exists)
    $(this).siblings("ul").toggle();
});

Answer 2

尝试在此上下文中使用.next()来实现您想要的目标，

$("a").on("click", function(e) {
  e.preventDefault();
  $(this).next("ul").toggle();
});

在锚点击时显示/隐藏子UL

2 个答案:

DEMO