Ответы пользователя по тегу JavaScript
  • Как из коллекции, получить Input в котором произошло изменение?

    Stalker_RED
    @Stalker_RED
    form.addEventListener('change', function(evt){
      console.log(evt.target, evt.target.value);
    });
    Ответ написан
    Комментировать
  • Как записать голосовое сообщение?

    Stalker_RED
    @Stalker_RED
    Почему type: 'audio/webm'? В разных браузерах и разных операционнках кодек по умолчанию отличается.
    Ответ написан
    Комментировать
  • Cобрать правильно массив из сортирующего списка?

    Stalker_RED
    @Stalker_RED
    const items = document.querySelectorAll('.item');
    const sorted = [... items].map(item => item.dataset.id);
    console.log(sorted);
    Ответ написан
  • Как реализовать логику расчета смен в приложении для графика сменности?

    Stalker_RED
    @Stalker_RED
    Остаток от деления номера дня в году на число дней в одном цикле - это смещение графика от начала года.
    Ответ написан
    2 комментария
  • Как получить элемент, который находится на одном уровне вложенности на чистом JS?

    Stalker_RED
    @Stalker_RED
    .nextElementSibling, не?
    Ну или parentNode.querySelector(...)
    Ответ написан
    Комментировать
  • Как сделать сортировку js?

    Stalker_RED
    @Stalker_RED
    Ответ написан
    Комментировать
  • Как сделать таймер для карточек товара?

    Stalker_RED
    @Stalker_RED
    Если нашел этот код в интернетах - выбрось без сожаления, и возьми нормальный.
    Если написал сам, то можно доработать:
    1. вместо document.querySelectorAll('.time-count__days...
    можно найти нужный контейнер со счетчиком, а потом искать разметку таймера уже в нем
    const card = document.querySelector('#селектор_карточки_товара');
    const days = card.querySelector('.time-count__days');
    Причем можно это делать один раз при инициализации скрипта, и не дергать DOM много раз каждую секунду.

    2. прописывать в каждой карточке разметку для секунд и минут - так себе идея. Можно вставлять ее скриптом. Заодно и не нужно будет ее искать.

    3. пропишите в CSS жестко размеры для элементов таймера, чтобы браузер не пытался делать reflow при изменении текста в них. Если нужна резиновость - можно привязать размеры к vh vw или пересчитывать их по событию resize.

    4. setInterval(foo, 1000) - плохо.
    setInterval не обещает, что код в следующий раз запустится через 1000ms, он обещает что он запустится НЕ РАНЬШЕ, чем через 1000ms. То есть при наличии на странице каких-то тяжелых скриптов таймер может пропускать тики. Хорошо хоть вычсление t у вас не просто счетом, а сравнением с new Date()
    Можно обновлять по requestAnimationFrame. Естественно не каждый кадр, а только когда изменились секунды.
    Ответ написан
    Комментировать
  • Почему JS не находит нужный элемент?

    Stalker_RED
    @Stalker_RED
    Любой из этих ошибок достаточно для того, чтобы ваш код не работал так, как вы хотите:

    1. при запросе getElementsByClassName не нужна точка перед именем класса, как archelon уже сказал. В результате элементы не найдены.
    2. блока с классом info_block у вас в разметке вообще нет. Есть с id=info_block, и его можно получить при помощи getElementById() или querySelector('#info_block')
    3. феерическая трешанина при использовании for. Похоже, вы совсем не понимаете как его применять и не знаете даже зачем.
    4. currentLink.onmouseover не сработает, т.ак как там пустая коллекция, из-за лишней точки в п.1
    Даже если б была не пустая, пользы никакой не будет, т.к. нужно вешать обработчик на конкретные элементы, а не на коллекцию.
    5. currentLink[i].parentNode - всегда будет ссылаться на последний найденный элемент, т.к. цикл for уже отработал. Но в вашем случае не ссылается никуда, т.к. элементы не найдены из-за лишней точки в п1.
    6. currentInfoBlock = infoBlock[i] то-же самое, элементы info_block не найдены, и индекс i указывает на последний линк.
    7. Если предположить, что приведенный фрагмент разметки у вас повторяется сколько-то раз на странице, тогда грубая ошибка - несколько элементов с одинаковым id.
    Ответ написан
    1 комментарий
  • Какую функцию лучше использовать?

    Stalker_RED
    @Stalker_RED
    Второй вариант изменяет дату. Это плохо, если она где-то еще используется.
    Ответ написан
    Комментировать
  • Почему не работает event.target.textContent = event.target.textContent.replace?

    Stalker_RED
    @Stalker_RED
    Работает, я просто скопироал ваш код
    https://jsfiddle.net/gkd237aj/

    Ну и можно его немного упростить
    https://jsfiddle.net/zky7ge1c/
    Ответ написан
    Комментировать
  • Как при вставке из буфера текста удалить блок div?

    Stalker_RED
    @Stalker_RED
    Вы отслеживаете keyup, который не срабатывает при вставке мышью например.
    А вам бы отслеживать paste, или возможно input, который отловит и ввод с клавиатуры и вставку.
    Ответ написан
    Комментировать
  • Как удалить все блоки с одинаковым классом из DOM?

    Stalker_RED
    @Stalker_RED
    Вы ведь удаляете только один элемент, с индексом 0.
    Попробуйте удалять все
    tabsFilterLocation.forEach(el => el.remove())
    Ответ написан
    Комментировать
  • Как сформировать компактный код загрузки аватарки?

    Stalker_RED
    @Stalker_RED
    Я бы не делал транслитерацию и проверку расширения. Вместо транслитерации генерировать название изображения на основе user_id, расширение вообще не проверять, - удалось прочитать картинку - отлично, конвертируем в единый для сайта формат. (конвертации у вас, кстати, нет, и вполне возможна загрузка rarjpeg или чего повеселее) Не удалось - неподдерживаемый формат. Проверка размера тоже не особо нужна.
    Половину ошибок текстовых можно спрятать от пользователя, незачем ему видеть что "Не удалось записать файл на диск", такие ошибки должны отправляться в мониторинг или админу на почту.
    Остальное вроде как стремно выбрасывать, вполне возможны случаи когда вместо картинки вам загрузят что-то другое.

    Какой-то сюр при записи в БД - вместо UPDATE USER почему-то вставка в таблицу wish(?), с прочерками в полях и цене(?!).

    Было даже интересно что там за навороченная загрузка фоточек на 46кб. Может там полновесный фоторедактор? Потому что кроме кропа и парочки фильтров при загрузке аватарки сложно что-то придумать. но мало-ли.
    Оказалось загрузчик занимает строчек 20, и в нем только jQuery.post и вывод парочки сообщений. Остальное место занято jQuery выпуска 2014 года. Вы вообще пытаетесь понять что вы делаете, или просто тащите всякий хлам из этих ваших интернетов в надежде, что оно как-то само заработает?
    Ответ написан
    1 комментарий
  • Как вывести только четные значения массива, не создавая новый массив?

    Stalker_RED
    @Stalker_RED
    при срабатывании return функця завершает работу, цикл не продолжается.
    Уточните что вы подразумеваете под "вывести" и что под "не создавая новый массив".
    Можно отфильтровать нативным Array.filter() но при этом создается новый массив.
    const result = arr.filter(n => !n%2);
    Если "вывести", это просто в консоль, то достаточно в вашем коде вместо return написатьconsole.log(arr[i])
    Ответ написан
    2 комментария
  • Проблема функций с помощью массива с var?

    Stalker_RED
    @Stalker_RED
    Это фокус с машиной времени. Дело в том, что код не всегда исполняется сверху вниз, как вы его читаете. В момент создания функций переменная меняется на 0,1,2. В момент вызова этих функций она уже равна 3.
    Значение i не передается в переменные в момент создания функций, оно читается уже в момент их вызова.

    Но вообще и в переменной var, и в let и в const может быть любое значение - примитив, ссылка на объект, на функцию. Разница в основном в областях видимости, и частичной неизменности const. Если вы измение var i на let i, то в консоль выведется 0,1,2. Если вы вынесете объявление i на строчку выше, то будет так-же как с var.
    Все дело в фигурных скобочках :)
    var funcs = [];
    // let's create 3 functions
    let i = 0
    for (; i < 3; i++) {
      // and store them in funcs
      funcs[i] = function() {
        // each should log its value.
        console.log("My value:", i);
      };
    }
    for (var j = 0; j < 3; j++) {
      // and now let's run each one to see
      funcs[j]();
    }


    Пустые блоки имеют смысл только если вам нужно ограничить область видимости для какой-то операции. А конкретно вашем примере смысла от скобок нет.
    Ответ написан
  • Как использовать addEventListener на пользовательское событие?

    Stalker_RED
    @Stalker_RED
    https://developer.mozilla.org/ru/docs/Web/API/Even...
    Пример, где событие myEvent отправляется после нажатия на кнопку #pew:
    const event = new Event('myEvent'); // создаем кастомное событие myEvent
    
    pew.addEventListener('click', function() { // слушаем клик по кнопке
      circle.dispatchEvent(event); // отправляем событие myEvent
    });
    
    circle.addEventListener('myEvent', function(evt) { // слушаем событие myEvent
      // какая-то полезная нагрузка
      console.log(evt.target);
    });

    https://jsfiddle.net/Stalk/ujd2t5og/
    Ответ написан
    Комментировать
  • Как проверить два объекта по шаблону?

    Stalker_RED
    @Stalker_RED
    Если писать проверку кодом, то все просто
    function check(data) {
    	return Object.hasOwn(data, 'd') && data.m === 1;
    }

    https://jsfiddle.net/wzt492vL/

    Если нужен именно объект с правилами, то записать в него регулярки, например?
    const rule = {
     d: /.+/,
     m: /1/,
    }
    
    function check(data) {
    	let result = true;
      for (const key in rule) {
        if (!Object.hasOwn(data, key)) return false;
        if(!rule[key].test(data[key])) return false;
      }
      return result;
    }
    https://jsfiddle.net/8u46rw3d/
    Ответ написан
    2 комментария
  • Почему forEach выдает разные результаты?

    Stalker_RED
    @Stalker_RED
    a.a+=1 сработает.
    Вы в первом случае меняете значение a.a (больше однобуквенных названий, давайте добавим в мире путаницы!)
    во втором просто складываете его значение с единицой и никуда это значение не применяете.
    let x = 3 // x=3
    x++ // x=4 инкремент
    let y = x + 1 // y=5, x=4 все еще 
    x += 2 // x=6
    Ответ написан
    Комментировать
  • Как написать цикличный таймер?

    Stalker_RED
    @Stalker_RED
    Напишите список ваших задач, или периодов, или как их там. В них храните либо длительность, либо время начала и окончания, как вам удобнее.

    Напишите ОДИН setInterval, который сравнивает текущее время со временем старта или конца ваших периодов.

    Конструкции типа time-- идут лесом.
    Потому что и setInterval и setTimeout не гарантируют время срабатывания. Они работают "не раньше чем", а позже - запросто. Только хардкор: const now = new Date() на каждом тике таймера.

    Всякие циферки для отображения вычисляются из разницы между now и start или end, математика простейшая.
    Ответ написан
    Комментировать