const className = 'select';
const sumEl = document.querySelector('.sum');
const sum = elements =>
Array.prototype.reduce.call(
elements,
(acc, n) => acc + (+n.value || 0),
0
);
const updateSum = () => sumEl.textContent = sum(document.getElementsByClassName(className));
document.addEventListener('change', e => e.target.classList.contains(className) && updateSum());
updateSum();
const selects = document.querySelectorAll(`.${className}`);
const updateSum = () => sumEl.innerText = sum(selects);
selects.forEach(n => n.addEventListener('change', updateSum));
updateSum();
.test('fileSizes', 'Resolution at least 120x120px', value => {
return new Promise(resolve => {
const img = new Image();
img.onload = () => resolve(img.width >= 120 && img.height >= 120);
img.src = window.URL.createObjectURL(value);
});
})
.submenu
, он должен находится внутри того же li
, что и соответствующий ему .profile-menu-trigger
.$('.profile-menu')
.on('mouseenter', '.profile-menu-trigger', function() {
$(this).next('.submenu').fadeIn(500);
})
.on('mouseleave', 'li', function() {
$(this).find('.submenu').fadeOut(500);
});
$('селектор контейнеров пар слайдеров').each(function() {
$('.slider-for', this).slick({
...
asNavFor: $('.slider-nav', this),
});
$('.slider-nav', this).slick({
...
asNavFor: $('.slider-for', this),
});
});
console.log(Object.entries(obj).reduce((max, n) => n[1] > max[1] ? n : max).join(': '))
v-for
, которому будет передаваться массив с данными. Блок базовой комплектации примет примерно такой вид:baseOptions: [
{ name: 'Свойство 1', price: 10000 },
{ name: 'Свойство 2', price: 11000 },
...
<ul>
<li v-for="n in baseOptions">{{ n.name }} ({{ n.price }})</li>
</ul>
v-model
):extraOptions: [
{ name: 'Пакет 1', price: 16000, checked: false },
{ name: 'Пакет 2', price: 17000, checked: false },
...
<div v-for="n in extraOptions">
<input type="checkbox" v-model="n.checked">
<label>{{ n.name }}</label>
</div>
methods: {
sum: arr => arr.reduce((acc, n) => acc + n.price, 0),
computed: {
baseSum() {
return this.sum(this.baseOptions);
},
extraSum() {
return this.sum(this.extraOptions.filter(n => n.checked));
},
filters: {
price: val => `${val.toLocaleString()} р.`,
<span>{{ baseSum | price }}</span>
<span>{{ extraSum | price }}</span>
<gmap-info-window
:options="infoOptions"
:position="infoWindowPos"
:opened="infoWinOpen"
@closeclick="infoWinOpen = false"
>
{{ infoContent }}
</gmap-info-window>
onMarkerClick(e) {
this.infoWindowPos = e.latLng; // задаём положение окна, над кликнутым маркером
this.infoContent = JSON.stringify(e.latLng); // задаём контент окна, передаётся в слот
this.infoWinOpen = true; // открываем окно
},
if (counting >= 10) { level++; counting = 0;
function getScore(arr) {
const points = [ 0, 40, 100, 300, 1200 ];
let score = 0;
let lines = 0;
for (const n of arr) {
score += points[n] * (1 + (lines / 10 | 0));
lines += n;
}
return score;
}
$('.away-players').text(function(i, text) {
return $('.subs-players td:even')
.get()
.map(n => $(n).text().split(', '))
.reduce((text, n) => text.replace(n[1], `(${n.join(' ')})`), text);
});
Количество LI элементов заранее не известно, поэтому выполнять функцию WHEN с определенным количеством аргументов нет возможности.
$.when(...$('li').get().map(n => $.ajax())).then(/* выполняйте, чо там вам надо */);
this.data = new Proxy(...
сделайтеreturn new Proxy(this, {
get(target, name) {
return name in target
? target[name]
: `Свойства ${name} нет`
},
});
created() {
const onClickOutside = e => this.opened = this.$el.contains(e.target) && this.opened;
document.addEventListener('click', onClickOutside);
this.$on('hook:beforeDestroy', () => document.removeEventListener('click', onClickOutside));
},
for (const [ k, v ] of new URLSearchParams(url.replace(/.*\?/, ''))) {
document.querySelector(`#${k}`).value = v;
}
url
.slice(url.indexOf('?') + 1)
.split('&')
.map(n => n.split('='))
.forEach(n => document.getElementById(n[0]).value = n[1]);
const data = [...url.split('?').pop().matchAll(/([^&]+)=([^&]*)/g)];
for (let i = 0; i < data.length; i++) {
document.querySelector(`[id="${data[i][1]}"]`).value = data[i][2];
}
const getMonthName = iMonth =>
new Date(0, iMonth).toLocaleString('ru-RU', { month: 'long' });
computed: {
groupedByMonth() {
return this.items.reduce((acc, n) => {
const key = getMonthName(n.date.split('-')[1] - 1);
(acc[key] = acc[key] || []).push(n);
return acc;
}, {});
},
},
<ul>
<li v-for="(items, month) in groupedByMonth" :key="month">
<h3>{{ month }}</h3>
<ul>
<li v-for="n in items" :key="n.id">{{ n }}</li>
</ul>
</li>
</ul>
groupedByMonth() {
return this.items.reduce((acc, n) => {
acc[n.date.split('-')[1] - 1].items.push(n);
return acc;
}, Array.from({ length: 12 }, (_, i) => ({
month: getMonthName(i),
items: [],
})));
},
<ul>
<li v-for="{ items, month } in groupedByMonth" :key="month">
<h3>{{ month }}</h3>
<ul v-if="items.length">
<li v-for="n in items" :key="n.id">{{ n }}</li>
</ul>
<div v-else>данных нет</div>
</li>
</ul>