<div class="controll">
<button type="button" data-value="all">All</button>
<button type="button" data-value="books">Books</button>
<button type="button" data-value="film">Film</button>
<button type="button" data-value="music">Music</button>
</div>
<div class="box">
<div class="item" data-value="books">
Books
</div>
<div class="item" data-value="film">
Film
</div>
<div class="item" data-value="music">
Music
</div>
<div class="item" data-value="books">
Books
</div>
<div class="item" data-value="film">
Film
</div>
</div>(function($) {
'use strict';
$('button', $('.controll')).on('click', function(event) {
event.preventDefault();
var value = $(this).data('value');
if (value === 'all') {
$('.item', $('.box')).fadeIn(300);
} else {
$('.item[data-value!="'+ value +'"]', $('.box')).hide();
$('.item[data-value="'+ value +'"]', $('.box')).fadeIn(300);
}
});
})(jQuery);Promise, так как XHR выполняется асинхронно.function ajax(params) {
var request = new XMLHttpRequest();
request.open(params.method, params.url, params.async || true);
request.setRequestHeader('Content-Type', params.contentType || 'application/x-www-form-urlencoded; charset=UTF-8');
request.onreadystatechange = function() {
if (this.readyState === 4) {
if (this.status >= 200 && this.status < 400) {
if (params.success) params.success(this.responseText, this.statusText, this.status);
} else {
if (params.error) params.error(this);
}
} else {
if (params.error) params.error(this);
}
};
request.send(params.data ? JSON.stringify(params.data) : '');
request = null;
}ajax({
url: 'lulz.json',
method: 'GET',
contentType: 'application/json; charset=UTF-8',
success: function(response, statusText, status) {
var mydata = JSON.parse(response);
console.log(mydata[0].name);
console.log(mydata[0].age);
console.log(mydata[1].name);
console.log(mydata[1].age);
},
error: function(XHR) {
console.log('Ajax Error', XHR);
}
});function ajax(params) {
var request = new XMLHttpRequest();
request.open(params.type, params.url, params.async ? params.async : true);
request.onload = function() {
if (request.status >= 200 && request.status < 400) {
// Успешный запрос
if (params.success) params.success(request.responseText);
} else {
// Запрос дошел до сервера, но вернул ошибку
if (params.error) params.error(request, request.status);
}
};
request.onerror = function() {
// Ошибка запроса
if (params.error) params.error(request, request.status);
};
request.setRequestHeader('Content-Type', params.contentType ? params.contentType : 'application/x-www-form-urlencoded; charset=UTF-8');
request.send(params.data);
}ajax({
type: 'GET',
url: 'https://jsonplaceholder.typicode.com/posts',
contentType: 'application/json; charset=UTF-8',
data: { key: 'prop' },
async: true,
success: function(response) {
console.log(response);
},
error: function(xhr, status) {
console.log(xhr, status);
}
});var timer = 0; и в функции showtime(param) перед вызовом setTimeout чистить таймер clearTimeout(timer)var timer = 0;
function showtime(param) {
var all=new Date();
var hours=all.getHours();
var minutes=all.getMinutes();
var seconds=all.getSeconds();
var timevalue = ((minutes<10) ? " :0" : " : ") + minutes;
timevalue += ((seconds<10) ? " :0" : " : ") + seconds;
if (param == 24) {
timevalue = " " + hours + timevalue;
}
else {
timevalue = " " + ((hours>12) ? hours-12 : hours) + timevalue;
timevalue += (hours>=12) ? " P.M. " : " A.M. ";
}
document.clock.next.value=timevalue;
clearTimeout(timer);
timer=setTimeout(function () {showtime(param);}, 1000);
}