<input id="min" type="number" value="25"> -
<input id="max" type="number" value="75">
<div id="range"></div>const values = {
min: 0,
max: 100,
};
const range = $('#range').ionRangeSlider({
type: 'double',
grid: true,
...values,
onChange(e) {
$('#min').val(e.from);
$('#max').val(e.to);
},
}).data('ionRangeSlider');
$('#min, #max').attr(values).on('input', function() {
const v = [ $('#min').val(), $('#max').val() ]
.sort((a, b) => a - b)
.map(n => Math.max(values.min, Math.min(values.max, +n)));
$('#min').val(v[0]);
$('#max').val(v[1]);
range.update({
from: v[0],
to: v[1],
});
}).trigger('input');<input id="min" type="number" value="25"> -
<input id="max" type="number" value="75">
<div id="range"></div>const values = {
min: 0,
max: 100,
};
$('#range').slider({
range: true,
...values,
slide(e, ui) {
$('#min').val(ui.values[0]);
$('#max').val(ui.values[1]);
},
});
$('#min, #max').attr(values).on('input', function() {
const v = [ $('#min').val(), $('#max').val() ]
.sort((a, b) => a - b)
.map(n => Math.max(values.min, Math.min(values.max, +n)));
$('#min').val(v[0]);
$('#max').val(v[1]);
$('#range').slider('values', v);
}).trigger('input');const reg = new RegExp(`(.+).{${symbolsForHide}}$`);
$('.phone_number')
.attr('data-phone', function() {
return $(this).text()
})
.text((i, text) => text.replace(reg , '$1...'));const
$this = $(this),
$phone = $this.siblings('.phone_number'),
phone = $phone.data('phone');
$phone.text(phone).attr('href', `tel: ${phone}`);
$this.remove();const key = 'prop';
const val = 1;const result = array.flatMap(n => n.filter(m => m[key] === val));
// или
const result = array.reduce((acc, n) => (
n.forEach(m => m[key] === val && acc.push(m)),
acc
), []);
// или
const result = [];
for (const n of [].concat(...array)) {
if (n[key] === val) {
result[result.length] = n;
}
}[...new Set(array.flatMap(n => n.columns).map(n => n.type).filter(n => !defaultTypes.includes(n)))]const group = (arr, key) =>
arr.reduce((acc, n) => {
const k = n[key];
(acc[k] = acc[k] || []).push(n);
return acc;
}, {});
const result = Object.values(group(array, 'prop'));function group(data, key, val = n => n) {
const getKey = key instanceof Function ? key : n => n[key];
const getVal = val instanceof Function ? val : n => n[val];
const grouped = {};
for (const n of data) {
(grouped[getKey(n)] ??= []).push(getVal(n));
}
return grouped;
}const groupedBySign = group([ 0, 1, 2, 3, -10, -20, -30, 0 ], Math.sign);const groupedByParity = group(Array(10).keys(), n => [ 'чётные', 'нечётные' ][n & 1]);const chars = group(
'ABC123?!+',
n =>
n.toLowerCase() !== n.toUpperCase() ? 'буква' :
Number.isInteger(+n) ? 'цифра' :
'другое'
);<input name="xxx" value="69">
<input name="xxx" value="187">
<input name="xxx" value="666">
<input name="yyy" value="0">const values = group(document.querySelectorAll('input'), 'name', 'value');const result = Object.values(Object.groupBy(array, n => n.prop));<div class="block">hello, world!!</div>
<div class="block">fuck the world</div>
<div class="block">fuck everything</div>
<button>click me</button>.block {
display: none;
}const $btn = $('button').click(function() {
$btn.hide();
$('.block').get().reduceRight((onComplete, el) => {
return () => $(el).fadeIn(300).delay(1000).fadeOut(300, onComplete);
}, () => $btn.show())();
});Проблема в том, что код <...> не удаляет класс
.js-contacts-form добавляет класс обратно. Останавливайте всплытие в обработчике клика по .detail-work__close; или проверяйте перед добавлением класса, где был клик и не добавляйте класс, если... ну, думаю понятно.
выполняются одновременно
new Promise, чтобы получить желаемую асинхронность. Проведите небольшой эксперимент - откройте консоль, выполнитеconsole.log('щас будем создавать промис');
new Promise(r => {
console.log('создаём промис');
setTimeout(() => {
console.log('так, сейчас дёрнем резолв');
r();
console.log('резолв дёрнули');
});
}).then(() => console.log('зарезолвились, наконец-то'));
console.log('промис создан');const $block = $('.picture__text');
const text = $block.text();
const itemSelector = '.pictures__another';$(document).on('mouseover mouseout', itemSelector, function(e) {
$block.text(e.type === 'mouseout' ? text : $(this).text());
});
// или
$(itemSelector).hover(
e => $block.text($(e.currentTarget).text()),
() => $block.text(text)
);Скорее всего я где-то не обнулил интервал или таймаут.
document.addEventListener('focus', function(e) {
if (e.target.tagName === 'INPUT') {
// здесь ваш код
}
}, true);const getLeapYears = (start, end) => Array
.from({ length: end - start + 1 }, (n, i) => start + i)
.filter(n => ((n % 100) && !(n % 4)) || !(n % 400));
console.log(getLeapYears(1888, 2099));function* getLeapYears(start, end) {
for (let i = Math.ceil(start / 4) * 4; i <= end; i += 4) {
if ((i % 100) || !(i % 400)) {
yield i;
}
}
}
console.log(...getLeapYears(1888, 2099));const containerSelector = '.choose-buttons';
const buttonSelector = '.btn';
const activeClass = 'active';
const maxActive = 3;$(containerSelector).on('click', buttonSelector, function(e) {
const numActive = $(`${buttonSelector}.${activeClass}`, e.delegateTarget).length;
const $this = $(this);
if (numActive < maxActive || $this.hasClass(activeClass)) {
$this.toggleClass(activeClass);
}
});
// или
document.querySelectorAll(containerSelector).forEach(n => {
n.addEventListener('click', onClick);
});
function onClick(e) {
const button = e.target.closest(buttonSelector);
if (button) {
const active = [...this.querySelectorAll(`${buttonSelector}.${activeClass}`)];
if (active.length < maxActive || active.includes(button)) {
button.classList.toggle(activeClass);
}
}
}событие не срабатывает
const oldSetDate = $.datepicker._setDate;
$.datepicker._setDate = function(...args) {
oldSetDate.apply(this, args);
setTimeout(() => args[0].input.find('.ui-datepicker-current-day').click());
};p.process-block__stage-number.active I
p.process-block__stage-number II
p.process-block__stage-number III
p.process-block__stage-number IV
button.process-block__btn(data-change=-1)
span
b prev
button.process-block__btn(data-change=+1)
span
b nextdocument.addEventListener('click', function(e) {
const button = e.target.closest('[data-change]');
if (button) {
const blocks = [...document.querySelectorAll('.process-block__stage-number')];
let active = blocks.findIndex(n => n.classList.contains('active'));
blocks[active].classList.remove('active');
active = Math.max(0, Math.min(blocks.length - 1, active + +button.dataset.change));
blocks[active].classList.add('active');
}
});