Как реализовать переход по ссылке /ua/ на jQuery

247

19 октября 2018, 06:10

$(document).ready(function() { 
  $('.dropdown').click(function(e) { 
    $(this).find('.lang-menu').toggleClass('open'); 
    $($(e.target).find('.down-caret').toggleClass('open-caret')); 
    e.preventDefault(); 
    e.stopPropagation(); 
    $(document).click(function() { 
      $('.lang-menu').removeClass('open'); 
      document.location.href = $(this).next().attr('href'); 
      $('.down-caret').removeClass('open-caret'); 
    }); 
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="dropdown lang"> 
  <a class="langswitch" href="/">РУС<span class="down-caret"></span></a> 
  <ul class="lang-menu"> 
    <li><a href="/ua/">УКР</a></li> 
  </ul> 
</div>

Answer 1

У вас ссылка лежит внутри контейнера, который обрабатывает событие onclick. Вы, вызовом e.preventDefault(); отключаете стандартную обработку события и, тем самым, мешаете распространить событие вглубь контейнера.

Уберите эту строку и все заработает

$(document).ready(function() { 
  $('.dropdown').click(function(e) { 
    $(this).find('.lang-menu').toggleClass('open'); 
    $($(e.target).find('.down-caret').toggleClass('open-caret')); 
//    e.preventDefault(); 
    e.stopPropagation(); 
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="dropdown lang"> 
  <a class="langswitch" href="/">РУС<span class="down-caret"></span></a> 
  <ul class="lang-menu"> 
    <li><a href="javascript:alert('Go!')">УКР</a></li> 
  </ul> 
</div>