• Как сделать такой select?

    BRAGA96
    @BRAGA96
    Никак. Логика таких select в том, чтобы скрыть стандартный select и отрисовать свой на div или ul > li. При выборе изменять кастомный и стандартный select. Лучше всего написать плагин с API методами (get, set ...) или использовать готовый.
    Ответ написан
    Комментировать
  • Как реализовать анимированную вставку текста через clone appendTo?

    BRAGA96
    @BRAGA96
    _btn.one('click', function(e){
    	var _html = _more.clone();
    	_html.hide().appendTo(_box).fadeIn(300);
    	console.log(_html);
    });


    Или вариант с slide
    _html.hide().appendTo(_box).slideDown(300);
    Ответ написан
    3 комментария
  • Как грамотно и красиво сформировать вложенность функций? Структура кода?

    BRAGA96
    @BRAGA96
    По поводу оптимизации.
    1. На один элемент можно вешать сразу несколько событий передав их объектом в методе .on
    $('.sounds-wrapper').on({
    	mouseenter: function() {
    		$(this).addClass('sounds-wrapper-active');
    	},
    	mouseleave: function() {
    		$(this).removeClass('sounds-wrapper-active');
    	}
    });

    2. Вместо такой конструкции
    $('#music-bottom').on('mouseenter', '.sounds-btn-left', function() {});

    Лучше передать контекст
    $('.sounds-btn-left', $('#music-bottom')).on('mouseenter', function() {});

    3. Вместо mouseenter и mouseleave можно использовать hover
    Первый аргумент принимает функцию если на элемент навели, а второй если мышь убрали
    $('#sound-bottom').on('hover', function() {
    	$(this).closest('.sounds-wrapper').addClass('sounds-btn-hover-right');
    }, function() {
    	$(this).closest('.sounds-wrapper').removeClass('sounds-btn-hover-right');
    });

    4. Когда будете создавать переменные, чтобы кэшировать элементы, то начините название с $, например $musicBottom. Так Вам и другим людям, которые будут смотреть Ваш код будет понятно что в этой переменной jQuery DOM элемент.
    Ответ написан
    3 комментария
  • Почему пропадает иконка от FontAwesome?

    BRAGA96
    @BRAGA96
    Вместо
    cfsubmitText = $cfsubmit.text();
    Вставить
    cfsubmitText = $cfsubmit.html();

    Вместо
    $cfsubmit.text(cfsubmitText);
    Вставить
    $cfsubmit.html(cfsubmitText);
    Ответ написан
    1 комментарий
  • Jquery - multidimensional array - как пробежаться по Массиву и изменить данные?

    BRAGA96
    @BRAGA96
    У Вас массив объектов и Вы хотите изменить свойство объекта по ключу. Для этого нужно пробежаться циклом по массиву, чтобы найти объекты и пробежаться по ключам объекта, чтобы найти нужные ключи и изменить их значения.
    var array = [{"id":"3","info":"my Info","startDate":"Fri Jun 08 2018 00:00:00 GMT+0200","endDate":"Thu Jun 21 2018 00:00:00 GMT+0200"},{"id":"4","info":"my Info 2","startDate":"Thu Aug 02 2018 00:00:00 GMT+0200","endDate":"Mon Aug 20 2018 00:00:00 GMT+0200"}];
    for (var object in array) {
    	for (var key in array[object]) {
    		if (key === 'startDate' || key === 'endDate') {
    			array[object][key] = new Date(array[object][key]);
    		}
    	}
    }
    console.log(array);


    Или можете запихнуть это в функцию, задать нужные ключи и в callback функции изменять значения.
    var array = [{"id":"3","info":"my Info","startDate":"Fri Jun 08 2018 00:00:00 GMT+0200","endDate":"Thu Jun 21 2018 00:00:00 GMT+0200"},{"id":"4","info":"my Info 2","startDate":"Thu Aug 02 2018 00:00:00 GMT+0200","endDate":"Mon Aug 20 2018 00:00:00 GMT+0200"}];
    
    changeArray(array, ['startDate', 'endDate'], function(value) {
    	return new Date(value);
    });
    
    function changeArray(array, keys, change) {
    	var find = function(key) {
    		if (typeof keys === 'string') {
    			return key === keys ? true : false;
    		} else if (Array.isArray(keys)) {
    			return keys.includes(key);
    		}
    	};
    	for (var object in array) {
    		for (var key in array[object]) {
    			if (find(key)) {
    				array[object][key] = change(array[object][key]);
    			}
    		}
    	}
    	return array;
    }
    Ответ написан
    Комментировать
  • Свой jQuery плагин?

    BRAGA96
    @BRAGA96
    Если Ваш плагин не требует привязки к DOM элементу, то можно использовать такой вариант:
    $.extend({
    	// Определяем имя плагина
    	plugin: function(params) {
    		// Соединяем переданные настройки плагина с настройками по умолчанию
    		var setting = $.extend(true, {}, params, {
    			state: true,
    			key: 'prop'
    		});
    		// Основной код плагина
    	}
    });
    
    // Использование
    $.plugin({
    	state: false
    });
    Ответ написан
    Комментировать
  • Как получить все значения checked type="radio"?

    BRAGA96
    @BRAGA96
    jQuery
    $('input[name="radioName"]:checked').val()
    Ответ написан
    Комментировать
  • Как правильно прописать присвоение атрибута при расфокусе?

    BRAGA96
    @BRAGA96
    $('#myinput').on({
    	focus: function() {
    		$(this).attr('placeholder', 'Focus');
    	},
    	blur: function() {
    		$(this).attr('placeholder', 'Blur');
    	}
    });
    Ответ написан
    Комментировать
  • Как убрать лишние нули вконце числа?

    BRAGA96
    @BRAGA96
    Можно написать свою функцию фиксирования числа.
    Могу поделится своей, которая фиксирует и не округляет число.
    /**
     * Установить к-во чисел после запятой (без округления)
     * @param {number} number - число
     * @param {number} fixed - к-во чисел после запятой, по умолчанию 4
     * @returns {number} - фиксированное число
    **/
    function numberFixed(number, fixed) {
    	if ((typeof number === 'number' || typeof number === 'string') && !isNaN(number - parseFloat(number))) {
    		number = String(number);
    		var split = number.split('.');
    		if (split.length > 1) {
    			var left = split[0];
    			var right = split[1].substr(0, (!fixed ? 4 : fixed));
    			return Number(left + (fixed !== 0 ? '.' + right : ''));
    		} else {
    			return Number(number);
    		}
    	}
    }


    Или можно нацепить на Number.prototype кастомный метод фиксирования
    Number.prototype.customFixed = function(fixed) {
    	var number = this;
    	number = String(number);
    	var split = number.split('.');
    	if (split.length > 1) {
    		var left = split[0];
    		var right = split[1].substr(0, (!fixed ? 4 : fixed));
    		return Number(left + (fixed !== 0 ? '.' + right : ''));
    	} else {
    		return Number(number);
    	}
    }


    Пример использования:
    // Функция
    numberFixed(515.6328456232, 5); //> 515.63284
    
    // Метод Number.prototype
    (515.6328456232).customFixed(5); //> 515.63284
    Ответ написан
    Комментировать
  • Не удается повесить событие jQuery на select?

    BRAGA96
    @BRAGA96
    Попробуйте так:
    $(window).on('load', function() {
    	$('select').on('click', function() {
    		// ...
    	});
    });
    
    $(document).on('click', 'select', function() {
    	// ...
    });
    Ответ написан
    Комментировать
  • Как выставить display none по ID?

    BRAGA96
    @BRAGA96
    $('#hide_th').hide();
    Ответ написан
    Комментировать
  • Как передать переменную в ajax методом POST?

    BRAGA96
    @BRAGA96
    Функция XMLHttpRequest IE8+
    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: 'ip.php',
      method: 'POST',
      contentType: 'application/json; charset=UTF-8',
      data: {
      	x: 5,
      	y: 10
      },
      success: function(response, statusText, status) {
        console.log('Запрос успешно отправился, получаем ответ', response);
      },
      error: function(XHR) {
        console.log('Ошибка запроса', XHR);
      }
    });
    Ответ написан
    Комментировать
  • Как задать значение переменной из localStorage другой переменной из этого же скрипта?

    BRAGA96
    @BRAGA96
    localStorage.record = newRecord;
    Ответ написан
    Комментировать
  • Филтрация по value в JS?

    BRAGA96
    @BRAGA96
    Логика работы примерно такая:
    <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);

    Посмотреть пример на codepen
    Ответ написан
    Комментировать
  • Как обратиться к нужному объекту?

    BRAGA96
    @BRAGA96
    $('.my_div', $('#GRAPH1'))
    $('#GRAPH1').find('.my_div')
    $('#GRAPH1 > .my_div')
    Ответ написан
    Комментировать
  • Как загрузить и обработать файл JSON?

    BRAGA96
    @BRAGA96
    Все действия с ответом запроса нужно делать в callback функциии или с помощью Promise, так как XHR выполняется асинхронно.
    Функция XMLHttpRequest IE8+
    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);
      }
    });
    Ответ написан
    Комментировать
  • Сайт с API предоставляющий историю изменения курса криптовалют?

    BRAGA96
    @BRAGA96
    История за 1 день, 7 дней, 30 дней, 90 дней, 180 дней и 365 дней. Также доступны web socket (socket.io) realtime данные.
    CoinCap.io
    Ответ написан
    Комментировать
  • Как сохранить результат GET запроса в переменную на JS?

    BRAGA96
    @BRAGA96
    Функция ajax запроса на plain js.
    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);
    }


    Вызов функции. В колбеке success делаем с ответом что хотим. Не забывайте, что XHR запросы происходят асинхронно.
    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);
    	}
    });
    Ответ написан
    Комментировать
  • Почему некорректно отображается переключение времени?

    BRAGA96
    @BRAGA96
    Вам нужно создать глобальную переменную 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);
    }
    Ответ написан
    Комментировать