Сообщение от рони
|
результат какой должен быть?
|
... тихо сам с собою ... предположим, что результат, это
массив индексов
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<style type="text/css">
.active{
background-color: rgba(255, 0, 0, 1);
color: rgba(255, 255, 255, 1);
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div class="custom-pager builder-days-selector">
<a class="active" data-slide-index="0"> <!-- class = "active"-->
<span class="pager-title">
Пн
</span>
<span class="circle">
<span class="inner-circle"></span>
</span>
</a>
<a class="active" data-slide-index="1">
<span class="pager-title">
Вт
</span>
<span class="circle">
<span class="inner-circle"></span>
</span>
</a>
<a class="active" data-slide-index="2">
<span class="pager-title">
Ср
</span>
<span class="circle">
<span class="inner-circle"></span>
</span>
</a>
<a class="active" data-slide-index="3">
<span class="pager-title">
Чт
</span>
<span class="circle">
<span class="inner-circle"></span>
</span>
</a>
<a class="active" data-slide-index="4">
<span class="pager-title">
Пт
</span>
<span class="circle">
<span class="inner-circle"></span>
</span>
</a>
<a class="active" data-slide-index="5">
<span class="pager-title">
Сб
</span>
<span class="circle">
<span class="inner-circle"></span>
</span>
</a>
<a class="active" data-slide-index="6">
<span class="pager-title">
Вс
</span>
<span class="circle">
<span class="inner-circle"></span>
</span>
</a>
</div>
<div class="out"></div>
<script>
$(function() {
var dayActive = [], parent = $('.builder-days-selector'), out = $('.out');
parent.on('click', 'a',function(event) {
event.preventDefault();
$(this).toggleClass('active');
var active = parent.find('.active');
dayActive = $.map(active, function(el) {
return $(el).data('slide-index')
})
out.text(dayActive)
});
parent.find('a:first').trigger('click').trigger('click');
});
</script>
</body>
</html>