нацеливание на ссылку с классом внутри <li>с помощью jquery

Question

У меня есть структура, которая выглядит следующим образом ...

<ul class="flex-direction-nav">
   <li>
    <a class="prev" href="#">Previous</a>
   </li>
   <li>
    <a class="next" href="#">Next</a>
  </li>

Используя JQuery, как мне настроить таргетинг на эти ссылки, чтобы я мог что-то сделать, когда пользователь щелкнет по нему.

Спасибо

РЕДАКТИРОВАТЬ: Может быть, я должен отметить, что текст не виден, а с отступом -9999px и фоновое изображение на своем месте.Я попробовал пару из них, но я не получаю предупреждение, которое я ищу.

Answer 1

$('.flex-direction-nav a').on('click', function(){
    // A link was clicked
})

Простая демонстрация Fiddle здесь.

Answer 2

try

//first link
$("ul.flex-direction-nav a.prev").click(function(e){
//code to be executed
});

//second link
$("ul.flex-direction-nav a.next").click(function(e){
//code to be executed
});

где параметр "e" является объектом события http://api.jquery.com/category/events/event-object/ Я бы рекомендовал заменить форму значения href с "#" на "javascript: void (0)",чтобы избежать срабатывания полос прокрутки

Answer 3

$(".prev").click(function() {
  alert("You clicked prev!");
});


$(".next").click(function() {
  alert("You clicked next!");
});

..

Или, конечно:

$(".flex-direction-nav a").click(function() {
   alert("You clicked a link in the navigation ul.");
});

Answer 4

$(".flex-direction-nav .prev").click(function(){
    //do stuff for prev button here
});
$(".flex-direction-nav .next").click(function(){
    //do stuff for next button here
});

Answer 5

Попробуйте ниже,

$('.flex-direction-nav li a').click (function () {
    if ($(this).hasClass('prev')) {
        //do prev
        alert('prev clicked');
    } else if ($(this).hasClass('next')) {
        //do next
        alert('next clicked');
    }
});

DEMO

Answer 6

$('.flex-direction-nav').find('a').click(function(){
    // Do something
});