#javascript #jquery #html
#javascript #jquery #HTML
Вопрос:
У меня есть короткий скрипт, который изменяет несколько готовых классов в документе, я запускаю этот скрипт для двух разных селекторов, сценарий идентичен, поэтому было интересно, есть ли способ сжать его в более короткий код?
jQuery(document).ready(function($){
var list1 = $('#slides .links li');
$(list1).filter(':first').addClass('active');
setInterval(function() {
if( $(list1).filter('.active').index() !== $(list1).length - 1 ) {
$(list1).filter('.active').removeClass('active').next().addClass('active');
}
else {
$(list1).removeClass('active').filter(':first').addClass('active');
}
}, 4000);
var list2 = $('#slides .pics li');
$(list2).filter(':first').addClass('active');
setInterval(function() {
if( $(list2).filter('.active').index() !== $(list2).length - 1 ) {
$(list2).filter('.active').removeClass('active').next().addClass('active');
}
else {
$(list2).removeClass('active').filter(':first').addClass('active');
}
}, 4000);
});
Если есть имя для метода, который кто-то будет использовать для сжатия этого, я посмотрю его и попробую переписать. Большое спасибо.
Комментарии:
Ответ №1:
Попробуйте создать для этого общую функцию и вызывать ее по отдельности,
function timer(list) {
list.filter(':first').addClass('active');
setInterval(function() {
if(list.filter('.active').index() !== list.length - 1 ) {
list.filter('.active').removeClass('active').next().addClass('active');
}
else {
list.removeClass('active').filter(':first').addClass('active');
}
}, 4000);
}
timer($('#slides .links li'));
timer($('#slides .pics li'));
Комментарии:
1.
$(list).filter(':first').addClass('active');
должно быть за пределами интервала2. @Alex да .. посмотри внимательно ..!
Ответ №2:
Поскольку в каждом списке есть:во-первых, я бы сделал
$(function() {
var $list = [$('#slides .links li),$('#slides .pics li')];
$list.each(function() { this.filter(':first').addClass('active')});
setInterval(function() {
$list.each(function() {
if(this.filter('.active').index() !== this.length - 1 ) {
this.filter('.active').removeClass('active').next().addClass('active');
}
else {
this.removeClass('active').filter(':first').addClass('active');
}
});
}, 4000);
});