Ответы пользователя по тегу JavaScript
  • Как получить самую давнюю дату, хранящуюся в массиве?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    new Date( // чтобы конечный результат был в виде человеко читаемой строки
     Math.min.apply(  // применим функцию поиска минимального элемента в массиве с помощью apply
       null, // контекст не нужен
       arr.map(i => new Date(i.date)) // в качестве массива, среди которого ищем минимум - массив дат, преобразованных в Date
      )
    ).toISOString() // собственно, преобразовываем в человеко понятную строку.


    Ну или нагляднее:
    const dates = arr.map(i => new Date(i.date))
    const minDate = Math.min.apply(null, dates)
    const minDateString = new Date(minDate).toISOString()
    Ответ написан
    Комментировать
  • Как сделать операцию сложения с innerText и числом?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Вы были в шаге от успеха.
    - text.innerText += number;
    + text.innerText = Number.parseInt(text.innerText) + number;

    Ну или нужно было перед этим прибавить к number значение из инпута
    Ответ написан
    Комментировать
  • Как вместить страницу в один экран?

    MrDecoy
    @MrDecoy Куратор тега CSS
    Верставший фронтендер
    Ответ написан
    Комментировать
  • Постраничная навигация Битрикс (через "показать еще"). Как решить ошибку в JS?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    querySelector* вызывается на DOM элементах. Сервер не может вернуть Вам ссылку на дом элемент.
    Что в data? Селектор, судя по всему? тогда
    document.querySelector(data).querySelector('.news-item')
    , если это сужение поиска необходимо.
    ---
    $(data).find('.news-item') не равно data.querySelectorAll('.news-item'). Вы либо ошиблись, либо не до конца понимаете что такое $(data)
    Ответ написан
  • Как покрасить текст в зависимости от символа?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    const MCITEMDIFFERENCE = document.querySelectorAll('.mc__span');
    
    MCITEMDIFFERENCE.forEach((element)=>{
        if (element.innerHTML.startsWith("+") {
            element.classList.add("plusDifference");
        }
        if (element.innerHTML.startsWith("-") {
            element.classList.add("minusDifference");
        }
    })

    Dzambulat, а круглые скобки кто будет после if закрывать?
    Вам ошибка синтаксиса в консоле вообще ни о чём не намекает?

    Вот где исправлено и работает:
    Ответ написан
    1 комментарий
  • Как вывести текст в div на jquery?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    3 комментария
  • Как обрабатывать событие $('.div-nested').on('click', function() { у ещё не созданных элементов?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Либо по средствам делегирования событий (рекомендуется)
    И тогда на jQuery будет что-то типа:
    $('.div-0').on('click', '.div-nested', function() {...}

    Либо при создании элемента добавлять ему обработчик.
    И тогда что-то типа:
    var d = $('div', {
      class: 'div-nested',
      on: {
        click: function() {}
      }
    })
    Ответ написан
    2 комментария
  • Как сделать ренж инпуты?

    MrDecoy
    @MrDecoy Куратор тега CSS
    Верставший фронтендер
    1) Зависит от того, нужна ли возможность менять значения.
    Если нет(а судя по скриншоту как раз это просто индикатор), то это скорее тэг meter или progress
    Правда у progress всего 1 цвет по умолчанию, а у meter 3 цвета, а у вас, судя по картинкам - 4 (орандж, жёлтый, зелёный, фиолетовый)
    То есть можно создать на основе meter свой компонент или сделать обработчик и доопределить цвета в зависимости от значения, либо обойтись 3мя цветами (которые можно переопделить: https://stackoverflow.com/questions/8094835/how-to...)
    На худой конец это просто div с заливкой.

    2) Как определять цвета - это Вам не у нас нужно спрашивать. То есть нужно узнать на каком основании делать разбивку. Мы можем придумать Вам вариант, но Вы и сами можете придумать как угодно (описанный в вопросе вариант - один из возможных). Если это просто рандомный макет, то так и сделайте. Задавайте как в голову придёт. Если нет - спросите у постановщика.
    Ответ написан
    Комментировать
  • Как вызывать функцию по кнопке больше одного раза?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    btn_open.onclick = modal.style.display = "block"
    Так а зачем вы перезаписываете функцию, которая должна происходить по клику?

    Что необходимо изменить, чтобы функция постоянно отзывалась по клику?

    - btn_open.onclick = modal.style.display = "block"
    + modal.style.display = "block"
    Ответ написан
    Комментировать
  • Как элементы массива сделать значениями объекта?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Мое решение:

    let arr = ['a', 'b', 'c', 'd', 'e'];
    let obj = {};
    for (let i = 0; i <= arr.length; i++) {
    obj[i + 1] += arr;
    }
    console.log(obj);


    Ну Вы были относительно близко.
    1. Зачем Вы делаете += ? Вы же не плюсуете к чему то, а назначаете значение. То есть
    - obj[i + 1] += arr;
    + obj[i + 1] = arr;

    2. Зачем Вы прибавляете весь arr, когда Вам нужен элемент массива, а не весь массив. То есть:
    - obj[i + 1] = arr;
    + obj[i + 1] = arr[i];

    3. Цикл выполнится 6 раз, так как у Вас от нуля до длины массива - 5. То есть, 0,1,2,3,4,5. Вместо этого можно начать с 1, и в итоге тогда:
    let arr = ['a', 'b', 'c', 'd', 'e'];
    let obj = {};
    for (let i = 1; i <= arr.length; i++) {
    obj[i] = arr[i-1];
    }
    console.log(obj);


    Ну и как уже сказали выше, можно через reduce. Тогда будет значительно короче:
    let arr = ['a', 'b', 'c', 'd', 'e'];
    let obj = arr.reduce((a, c, i) =>  (a[i+1] = c, a), {});
    console.log(obj);
    Ответ написан
    Комментировать
  • Cannot read properties of null (reading 'classList')?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Не стал считать какая строка у Вас тут 31ая...
    Ошибка означает, что querySelector* или переменная, на которой это вызывается - вернули null.
    То есть элемент не найден в разметке.
    Ответ написан
    Комментировать
  • Почему axios запрос работает не так как я ожидаю?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    оффтоп

    Интересно, про это каждый день спрашивают, или всё же с промежутками...

    console.log(data) - а по факту я получаю не то, что было там
    console.log(obj)

    Это выполнится раньше чем запрос.
    Если Вам это понятно, то что Вам НЕ понятно?
    Либо всё дальше в .then, либо идите дальше осваивать асинхронный javascript, а именно - async\await

    Ну и
    но как тогда сделать правильно в моем случае

    1) Правильно понятие абстрактное и относительное
    2) Откуда нам знать что Вы делаете, чтобы предложить варианты? Где критерии для "правильно"?
    Ответ написан
  • Как отследить изменение содержимого input через jQuery?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Не с той стороны Вы подошли к вопросу.
    Вам не за инпутом следить надо, а пойти в доку дэйтпикера и найти событие, которое эмитится наверх при выборе даты в дэйтпикере, подписаться на него и делать нужную обработку.

    https://jqueryui.com/datepicker/

    В случае с этим дэйтпикером нужно указать коллбэк в соответствующей опции при инициализации:
    https://api.jqueryui.com/datepicker/#option-onSelect
    Ответ написан
    Комментировать
  • Каррирование... Что здесь происходит?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Константин, карирование оно не в вызове функции. А в том, что после вызова функции возвращается другая функция, внутри которой есть замыкание на аргумент, переданный в предыдущий вызов.

    Правильно ли я понимаю, что curriedSum(1)(2,3) - здесь в качества a - цифра 1, а в качестве b - (2,3) ? А как же c?

    Eсли смотреть относительно функции sum, то:
    В первых круглых скобка только a = 1.
    Во вторых круглых скобках b = 2 и c = 3.

    А здесь тогда как? curriedSum(1)(2)(3) - где здесь каррирование?

    Первый вызов вернёт функцию, которая "помнит" 1, второй вызов вернёт функцию, которая "помнит" 1+2, ну и третий вызов вернёт сумму 1+2+3.

    То есть эта запись: curriedSum(1)(2)(3)
    Эквивалентна этой:
    let curriedSum = curry(sum); // сделали функцию sum карируемой.
    
    var one = curriedSum(1) // так как sum ожидает 3 аргумента, то этот вызов вернёт функццию, которая помнит 1 и ожидает ещё 2 аргумента.
    var onePlusTwo = one(2) // так как sum ожидает 3 аргумента, то этот вызов вернёт функццию, которая помнит 1 и 2 и ожидает ещё 1 аргумент.
    var result = onePlusTwo(3) // так как sum ожидает 3 аргумента, два аргумента уже помнит функция onePlusTwo и мы передаём третий аргумент, то вернёт результат sum(1,2,3)
    result == 6 // true
    
    // При этом, мы можем в данном случае снова вызвать onePlusTwo, но уже с другим аргументом,
    // и получим соответствующий результат:
    onePlusTwo(7) // вернёт 10, так как onePlusTwo помнит 1+2, то есть получим sum(1,2,7) // 10.

    Вот в чём и состоит смысл карирования. Иметь функцию, которая помнит какое-то значение и не требует каждый раз это значение в аргументах.
    Ответ написан
    Комментировать
  • Как вставить элемент в середину листа?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    jquery
    native js

    Правила сервиса
    2.2 Убедиться в том, что в сети Интернет, и на страницах Сервиса в частности, отсутствуют ответы на данный вопрос. Специально для этого талантливые IT-специалисты создали и развивают поисковые системы Яндекс и Google.
    Ответ написан
    Комментировать
  • Как при помощи jquery добавить маску (параметр) к ссылке?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    if (link == location)
    // Заменить на
    if (location.startsWith(link))
    Ответ написан
    Комментировать
  • Какую валидацию правильно делать для email в формах авторизации на js?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Во фронтенде практически не существует стандартов. В любом его направлении.
    Даже валидная вёрстка не стандарт (ну или, как минимум, не обязательный/не повсеместный).

    Валидация email на фронте не даёт 100% гарантию что email верный и существует.
    Можно лишь обязать пользователя соблюсти определённый паттерн.

    Если чистый js, то можно воспользоваться validation api и регулярным выражением.
    https://developer.mozilla.org/ru/docs/Learn/Forms/...
    Ответ написан
    Комментировать
  • Не открывается всплывающее окно оплаты в чём может быть ошибка?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Итак, если я верно понял, то response.result это вот это:
    {
      "orderId":"ec90-333b-9813",
      "formUrl":"https:\/\/securepayments.sberbank.ru\/payment\/merchants\/sbersafe_sberid\/payment_ru.html?mdOrder=ec90-333b-9813"
    }


    Возникает вопрос. Где тут errorCode?
    Если Вы указали полные данные - то нигде.
    Соответственно, errorCode - undefined.
    Но у Вас не строгое равенство, соответственно имеем, undefined == null // true.
    Это условие должно во всем браузерах отработать одинаково.
    А вот открытие окон в браузере может быть по умолчанию заблокировано и пользователю нужно дать на это разрешение.
    Ответ написан
  • Как поправить ошибку Uncaught TypeError: this.switchers[i].hideConfirm is not a function?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    У Вас на сайте расширен прототип Array методом remove, который сделан перечисляемым. (Расширение прототипов давно признано плохой практикой)

    Когда в цикле делаете
    for (i in this.switchers) {
       this.switchers[i].hideConfirm();
    }

    Сначала перебирает нормально, а в конце i = "remove".
    Cоответственно this.switchers['remove'].hideConfirm // undefined.

    Хотфикс - читать перед тем, как пользоваться.
    for...in цикл не для массивов.
    Используйте forEach вместо него.
    Либо добавьте проверку на .hasOwnProperty

    P.s. а если бы Вы умели в отладку кода, то решили бы эту проблему минут за 15.
    https://learn.javascript.ru/debugging-chrome
    Ответ написан
  • Почему происходит подтормаживание анимации?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Потому что в ветке else в анимации раскрытия у Вас не одно и то же между первым и вторым примером.
    В первом случае там будет правильная высота, а во втором - 0.
    Первый случай:
    [{ height: `${answer.clientHeight}px` }, { height: 0 }]: Array(2)
    0: {height: '156px'}
    1: {height: 0}
    length: 2


    Второй случай:
    hideKeyframes: Array(2)
    0: {height: '0px'}
    1: {height: 0}
    length: 2


    Происходит так потому что в первом случае Вы "в рантайме" берёте значение высоты, а во втором один раз взяли и дальше передаёте аргументом.

    UPD: Рекомендую научиться отладке своего кода https://learn.javascript.ru/debugging-chrome.
    Решили бы проблему за 5 минут.
    Ответ написан
    1 комментарий