current_elem.checkboxDiv.addEventListener('click', function() {
hide(current_elem.cardDiv);
},false);
$(function() {
var events = [
["2016-07-25", "2016-07-15"]
];
function bigDay(date, arr) {
return arr.some(function(el) {
return el.some(function(d) {
return d == date
})
})
}
$(".datepicker").datepicker({
dateFormat: "yy-mm-dd",dayNamesMin: ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT'],
minDate: '-0d',
beforeShowDay: function(date) {
date = $.datepicker.formatDate("yy-mm-dd", date);
return bigDay(date, events) ? [true, "highlight_days", null] : [true, "", null]
},
onSelect: function(dateText, elem) {
bigDay(dateText, events) && ( window.location ="/today-lessons?date=" + dateText)
}
})
});
$(function() {
var isDown;
$(".fc").on("mousedown", function(e) {
e.preventDefault();
isDown = true
});
var offset = $(".path-container").offset();
var width = $(".border-path").width();
$(".path-container").mousemove(function(e) {
if (isDown) {
var left = e.pageX - offset.left - $(".fc").width() * 1.5;
var bleft = left + $(".fc").width();
var w = width - bleft - 4;
if (w > 0) {
$(".fc").css({
"left": left
});
$(".border-path").css({
"left": bleft,
"width": w
})
}
}
}).on("mouseup mouseleave", function() {
$(".fc").stop(true, true).animate({
"left": "-46px"
});
$(".border-path").stop(true,
true).animate({
"left": 0,
"width": "100%"
});
isDown = false
})
});
window.addEventListener("DOMContentLoaded", function() {
var clickHandler = "click";
if ("ontouchstart" in document.documentElement) clickHandler = "touchstart";
var multiselect = document.querySelector(".multiselect"),
select = multiselect.querySelector(".selectBox"),
checkboxes = multiselect.querySelector("#checkboxes");
select.addEventListener(clickHandler, function(event) {
checkboxes.classList.toggle("show");
checkboxes.classList.contains("show") ? window.addEventListener(clickHandler, hide) : window.removeEventListener(clickHandler,hide)
});
multiselect.addEventListener(clickHandler, function(event) {
event.stopPropagation();
creatSelected()
});
function hide() {
checkboxes.classList.remove("show");
window.removeEventListener(clickHandler, hide)
}
var inputs = checkboxes.getElementsByTagName("input"),
obj = {};
function creatSelected() {
for (var i = 0; i < inputs.length; i++) {
var div = obj[i];
if (inputs[i].checked) {
if (!div) {
obj[i] = div = document.createElement("div");
div.innerHTML = inputs[i].parentNode.textContent;
div.className = "educationCreate"
}
multiselect.appendChild(div)
} else if (div && div.parentNode) multiselect.removeChild(div)
}
}
creatSelected()
});
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
.multiselect {
width: 200px;
}
.selectBox {
position: relative;
}
.selectBox select {
width: 100%;
font-weight: bold;
}
.overSelect {
position: absolute;
left: 0; right: 0; top: 0; bottom: 0;
}
#checkboxes {
display: none;
border: 1px #dadada solid;
}
#checkboxes.show {
display: block;
}
#checkboxes label {
display: block;
}
#checkboxes label:hover {
background-color: #1e90ff;
}
</style>
</head>
<body>
<div class="multiselect" >
<div class="selectBox" >
<select>
<option>Образование</option>
</select>
<div class="overSelect"></div>
</div>
<div id="checkboxes">
<label for="one"><input type="checkbox" id="one"/>First checkbox</label>
<label for="two"><input type="checkbox" id="two"/>Second checkbox </label>
<label for="three"><input type="checkbox" id="three"/>Third checkbox</label>
</div>
</div>
<script>
window.addEventListener("DOMContentLoaded", function() {
var clickHandler = "click";
if('ontouchstart' in document.documentElement){
clickHandler = "touchstart";
}
//когда страница загрузилась
var multiselect = document.querySelector(".multiselect"), //находим нужный блок
select = multiselect.querySelector(".selectBox"), //находим кнопку в этом блоке
checkboxes = multiselect.querySelector("#checkboxes");//находим блок которым управлет кнопка
select.addEventListener(clickHandler, function(event) { //на кнопку ставим обработчик клика
checkboxes.classList.toggle("show"); //меняем или ставим класс
checkboxes.classList.contains("show") ? window.addEventListener(clickHandler, hide) : window.removeEventListener(clickHandler, hide)
// если класс "show" поставлен ставим обработчик на весь документ иначе убираем (управлемый блок уже закрыт, повторно закрывать его не надо)
});
multiselect.addEventListener(clickHandler, function(event) {
event.stopPropagation() //отменяем всплытие клика иначе выбор любого чекбокса или клик по кнопке закроет управлемый блок, т.к. при открытии мы навесили обработчик закрытия
});
/* функция отмены класса с самоудалением */
function hide()
{
checkboxes.classList.remove("show"); //удалем класс
window.removeEventListener(clickHandler, hide) //удалем обработчик с документа
}
});
</script>
</body>
</html>
var regexp = /([^\]\[]+)(?=\])/g,
str = "[123][456][qwerty]",
result=str.match(regexp);
alert(JSON.stringify(result));