как сделать что-то, если у элемента есть братья и сестры - PullRequest
2 голосов
/ 28 декабря 2010

У меня есть неупорядоченный список в виде левой навигационной панели с несколькими ссылками.большинство элементов списка имеют другой неупорядоченный список в виде подменю, связанного с ними.однако некоторые ссылки не имеют подменю.Я хочу отключить поведение по умолчанию для ссылок, которые имеют подменю, чтобы я мог открыть анимированное подменю.но в ссылках без подменю мне нужно, чтобы ссылка была кликабельной.javascript, который я должен сделать, это:

$(function(){
    if($("#leftNav ul:first > li > a").siblings().size() > 0){
        $("#leftNav ul:first > li > a").click(function(e){
            e.preventDefault();
        });
    }   

проблема в том, что это отключает поведение по умолчанию для всех ссылок, а не только для тех, у кого есть братья и сестры.HTML-код для левой навигационной панели выглядит следующим образом

<div id="leftNav">
    <ul>
        <li>
            <a href="#">Link 1</a>
            <ul>
                <li><a href="#">Submenu Link 1</a></li>
                <li><a href="#">Submenu Link 2</a></li>
                <li><a href="#">Submenu Link 3</a></li>
            </ul>
        </li>
        <li><a href="#">Link 2</a></li>
     </ul>
</div>

, поэтому поведение при щелчке необходимо удалить в ссылке 1, так как в качестве братского элемента <ul>.Ссылка 2 не имеет братьев и сестер, поэтому ее следует оставить в покое.

Ответы [ 4 ]

4 голосов
/ 28 декабря 2010

Один из способов сделать это - найти элементы li, которые имеют потомка ul, и в этом li найти a и нацелить их на:

$('#leftNav li:has("ul")').find('a').each(
    function(){
        $(this).click(
            function(){
                alert("No clicking here");
                return false;
            });
    });

JS Fiddle demo .

<ч />

Отредактировано для добавления исправленного jQuery:

$('#leftNav li:has("ul")').find('a').each(
    function(){
        $(this).click(
            function(){
                alert("No clicking here");
                return false;
            });
    });
$('#leftNav li:has("ul")').hover(
    function(){
        $(this).find('ul').slideDown();   
    },
    function(){
        $(this).find('ul').slideUp();
    });

Чуть более полезная демоверсия JS Fiddle .

3 голосов
/ 28 декабря 2010

Самый простой способ:

$("#leftNav ul:first > li > a").not(":only-child").click(function(e){
        e.preventDefault();
});
3 голосов
/ 28 декабря 2010
 <script type="text/javascript">
  $(function () {
      $("#leftNav ul:first > li > a").each(function (a, b) {
          var t = $(b);
          //alert(t.siblings().size() );
          if (t.siblings().size() > 0) {
              t.click(function (e) {
                  e.preventDefault();
              });
          }
      });
  });
 </script>
1 голос
/ 23 января 2014

У меня недостаточно высокий балл репутации, чтобы комментировать, но я просто хотел сказать, что ответ Чака отлично сработал для меня (ЗА ИСКЛЮЧЕНИЕМ ПОЖАРНОГО ЛИЦА?).Мое меню также скрывает другие открытые меню, прежде чем открывать то, которое вы щелкнули - вот код, который я использовал:

jQuery(document).ready(function($) { 
     $('ul.menu li ul.sub-menu').hide(); //Hide children by default

     $("ul.menu:first > li > a").not(":only-child").click(function(){
            event.preventDefault();
            $(this).parent().siblings().children('ul.menu li ul.sub-menu').css('display','none');
            $(this).siblings('.sub-menu').slideToggle(800);
       });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...