Simulate нажмите на следующем изображении

Question

Я делаю некоторые простые слайдера с JQuery с левыми, правыми кнопками (по кнопке мыши я хочу, чтобы имитировать нажмите на следующем изображении с классом gthumb и установить класс активного к нему)

HTML :

<div class="gleft"></div> 
<div class="gright"></div> 
    <div class="gal-thumbs"> 
    <a href="#" class="gthumb active"><img src="/sites/zum.kz/themes/lounge/gal/pub/pub1.jpg"></a> 
    <a href="#" class="gthumb"><img src="/sites/555.kz/themes/lounge/gal/pub/pub2.jpg"></a> 
    <a href="#" class="gthumb"><img src="/sites/555.kz/themes/lounge/gal/pub/pub3.jpg"></a> 
    <a href="#" class="gthumb"><img src="/sites/555.kz/themes/lounge/gal/pub/pub4.jpg"></a> 
    <a href="#" class="gthumb"><img src="/sites/555.kz/themes/lounge/gal/pub/pub5.jpg"></a> 
    </div> 

JS:

// change background on arrow click 
    var current_img = $('.gthumb.active'); 

    $('.gleft').live('click', function() { 
     current_img.next().trigger('click').addClass('active'); 
    }); 

при нажатии на .gleft он должен имитировать нажмите на следующее изображение из изображения с .active класса. Однако, когда я нажимаю на .gleft, ничего не происходит. Пожалуйста помоги.

Answer 1

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

$('body').on('click','.gleft', function() { 
    if($('.gthumb.active').next().length > 0){ 
     $('.gthumb.active').removeClass('active').next().trigger('click').addClass('active'); 
    } 
}); 
$('body').on('click','.gright', function() { 
    if($('.gthumb.active').prev().length > 0){ 
     $('.gthumb.active').removeClass('active').prev().trigger('click').addClass('active'); 
    } 
}); 

Демо: http://jsfiddle.net/T9uY8/

Answer 2

Это должно покрыть все ваши базы ...

// Click to go right 
$('body').on('click', '.gright', function() { 
    if($('a.active').next().length != 0){ 
    $('a.active').removeClass('active').next().addClass('active').trigger('click'); 
    } 
}); 

// Click to go left 
$('body').on('click', '.gleft', function() { 
    if($('a.active').prev().length != 0){ 
    $('a.active').removeClass('active').prev().addClass('active').trigger('click'); 
    } 
}); 

// Just to show the click is being triggered 
$('body').on('click', '.gthumb', function(){ 
    alert('I have been clicked!!'); 
}); 

Working Example

Answer 3

Прежде всего, live устарел, вы должны просто использовать on смотрите здесь http://api.jquery.com/live/

Чтобы вызвать щелчок, вам нужно только позвонить click()

var current_img = $('.gthumb.active'); 

$('.gleft').on('click', function() { 
    current_img.next().click().addClass('active'); 
});