<canvas ref="canvas"></canvas>
data: () => ({
ctx: null,
}),
mounted() {
this.ctx = this.$refs.canvas.getContext('2d');
},
methods: {
updateCanvas() {
const { ctx } = this;
...
const { items } = JSON.parse(json).response;
const html = `
<tbody>${items.map(n => `
<tr>
<td>${n.title}</td>
<td>${n.director}</td>
<td>${n.year}</td>
<td>${Object.values(n.photo).map(m => `<img src="${m}">`).join('')}</td>
</tr>`).join('')}
</tbody>
`;
$('#example').append(html);
// или
document.querySelector('#example').insertAdjacentHTML('beforeend', html);
items.forEach(function(n) {
const tr = this.insertRow();
tr.insertCell().textContent = n.title;
tr.insertCell().textContent = n.director;
tr.insertCell().textContent = n.year;
tr.insertCell().append(...Object.values(n.photo).reduce((acc, m) => (
(acc[acc.length] = new Image).src = m,
acc
), []));
}, document.getElementById('example').createTBody());
пробросить метод компонента Menu в качестве параметра компоненту Button
preg_match_all('/\-?\d+/', $str, $matches);
$numstr = implode(' ', $matches[0]);
$('input').datepicker({
beforeShowDay: date => [ date.getDay() === 6 ],
});
$('input').datepicker({
onRenderCell: (date, cellType) => ({
disabled: cellType === 'day' && date.getDay() !== 6,
}),
});
останавливает страх, что я знаю не все
Как с этим бороться
второй вопрос в заголовке
$('select').change(function() {
console.log($(':selected', this).text());
});
это же мультиселект, и когда выбрано два элемента, то имена двух элементов и получаем, а мне нужно только тот который выбрали
$('select').on('click', 'option', function(e) {
const $target = $(e.target);
if ($target.is(':selected')) {
console.log($target.text());
}
});
let prevSelected = [];
$('select').on('change', function(e) {
const selected = $(':selected', this).get().map(n => n.innerText);
const newSelected = selected.find(n => !prevSelected.includes(n));
prevSelected = selected;
if (newSelected) {
console.log(newSelected);
}
});
const $popup = $('#popup_idea');
const $list = $('.list_idea');
$list.on('click', '.open_win_idea', function() {
$popup.data('del', $(this).closest('li').index()).fadeIn();
});
$('.close_win_butt_yes').click(function() {
$list.children().eq($popup.data('del')).remove();
$popup.fadeOut();
});
$('.close_win_butt_no, .close_win').click(function() {
$popup.fadeOut();
});
const str = $('.list li')
.get()
.map(n => $(n).text())
.join(' ');
const str = Array
.from(document.querySelectorAll('.list li'), n => n.innerText)
.join` `;
const str = Array.prototype.reduce.call(
document.querySelector('.list').children,
(acc, n, i) => acc + (i ? ' ' : '') + n.textContent,
''
);
this.setState({
request: e.target.value,
}, () => console.log(this.state.request))
$('.list_idea').on('click', '.open_win_idea', function() {
$(this)
.closest('li')
.find('p')
.attr('contenteditable', (i, val) => val !== 'true')
.focus();
});
Vue.directive('emoji', (el, binding) => el.innerHTML = emoji(binding.value));
<div class="conversation_name" v-emoji="chatName"></div>
<div
v-for="item in items"
class="col-md-3 services-item"
:class="{ hoverClass: item.hover }"
>
<img :src="item.scr" alt="">
<h3 class="my_services_title">Тест</h3>
<button
class="btn-price"
@mouseenter="item.hover = true"
@mouseleave="item.hover = false"
>Нажать</button>
</div>
data: {
items: [
{
src: 'img/laptop.png',
hover: false,
},
{
src: 'img/laptop.png',
hover: false,
},
],
},
$('li, div, p', '#wrapper').attr('custom-attr', i => `test${i + 1}`);
document
.querySelector('#wrapper')
.querySelectorAll('li, div, p')
.forEach((n, i) => n.setAttribute('custom-attr', 'test' + -~i));