<button id="ulButton" onclick="ulToggle();">Кнопка</button>
<ul id="ul1">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
</ul>
<script>
var ul= document.querySelectorAll('#ul1>li'), N=3;
[].forEach.call(ul, function(i,ind) {
if(ind>=N) {
i.hidden=1;
}
});
function ulToggle () {
[].forEach.call(ul, function(i,ind) {
if(ind>=N) i.hidden=!i.hidden;
});
}
</script>
document.querySelector('#id_1кнопки').onclick = closeBlock;
document.querySelector('#id_2кнопки').onclick = closeBlock;
document.querySelector('#id_3кнопки').onclick = closeBlock;
function closeBlock () {
var block = document.querySelector('#id_блока');
if (!block) {
return;
}
return block.hidden= !block.hidden;
}
var currentSlide = 0;
var prevSlideItem = 0;
var sliderWidth = getComputedStyle(document.getElementsByClassName('slider')[0]).width;
var slides = document.getElementsByClassName('slide');
var computedSlides = getComputedStyle(slides[0]);
var slidesTransition = computedSlides.transition;
var arrayStyleSlides = slidesTransition.split(' ');
var animateDuration = parseFloat(arrayStyleSlides[1]) * 1000; // получить второе значение из transition (это продолжительность анимации)
var slidesNumber = slides.length;
var inners = document.querySelectorAll('.slider .navigation .inner');
nextSlide();
function nextSlide() {
var nextSlideButton = document.querySelector('.next-slide');
inners[currentSlide].className += ' ' + 'active-inner';
nextSlideButton.onclick = function () {
console.log('proc = ' + this.proc + ' на входе');
if (this.proc == 1)
console.log('Слайд не должен поменяться');
// Проверяем, происходит ли обработка события, чтобы не было наложения анимаций.
if (this.proc) return false;
currentSlide++;
if (currentSlide > slidesNumber - 1)
currentSlide = 0;
if (currentSlide !== 0) {
slides[currentSlide - 1].style.left = sliderWidth;
slides[currentSlide].style.opacity = '1';
setTimeout(function() {
slides[currentSlide - 1].style.opacity = '0';
},animateDuration + 50);
setTimeout(function() {
slides[currentSlide - 1].style.left = '0px';
nextSlideButton.proc = 0;
},animateDuration * 2);
prevSlideItem = currentSlide - 1;
} else {
slides[slidesNumber - 1].style.left = sliderWidth;
slides[currentSlide].style.opacity = '1';
setTimeout(function() {
slides[slidesNumber - 1].style.opacity = '0';
},animateDuration + 50);
setTimeout(function() {
slides[slidesNumber - 1].style.left = '0px';
currentSlide
nextSlideButton.proc = 0;
},animateDuration * 2);
prevSlideItem = slidesNumber - 1;
}
this.proc = 1
console.log(this.proc + ' событие запущено, proc = 1');
};
}
Например сделать жесткую политику наведения, именно этот блок, дочерний нельзя либо что-то в этом духе
<div id="field" >
<div class=parent style="width:100px; height:100px; background:#def;">
<div class=child style="width:50px; height:50px; background:#cde;"></div>
</div>
</div>
<script>
document.getElementById('field').onmouseover= function(e) {
var t= e.target;
if(t.className === "parent") console.log("t.className= ", t.className);
e.stopPropagation();
};
</script>
<form method="POST" name=f action="/PHP/TesT.php" onsubmit="return false;">
<input type="text" name="name" value=Вова>
<input type="text" name="family" value=Пупкин>
<input type="text" name="data" value=value>
<button name="submit" onclick="sendForm(this.parentNode); return false;">Отправить</button>
</form>
'use strict';
function sendForm (f) { //
var button= f.submit;
var xhr = new XMLHttpRequest();
// console.log('xhr= ', xhr);
xhr.open('POST', f.action, true);
var fS= new FormData(f);
xhr.send(fS);
console.log('fS= ', fS);
xhr.onreadystatechange = function() {
if (xhr.readyState != 4) {
console.log('xhr.readyState= ', xhr.readyState);
return;
}
button.textContent = 'Готово!';
alert(xhr.status != 200 ? xhr.status + ': ' + xhr.statusText: xhr.responseText);
}
button.textContent = 'Загрузка...';
button.disabled = true;
}
sendForm(ваша форма);