Ответы пользователя по тегу JavaScript
  • "Приложение с историями", вопрос с масивами?

    Stalker_RED
    @Stalker_RED
    document.addEventListener('keydown', function(evt) { // слушаем нажатия кнопок
      if (evt.code === 'Enter')
        showNextMsg();
    });
    
    const msg = function* () {
    	yield* [ // генерируем сообщения
        { name: 'Вася', txt: 'Привет!' },
        { name: 'Петя', txt: 'И тебе привет!' },
        { name: 'Вася', txt: 'Как дела?' },
        { name: 'Петя', txt: 'Хреново, мой хомяк заболел' },
        { name: 'Вася', txt: 'Аха-ха-ха' },
        { name: 'Петя', txt: 'Василий, вы - бесчувственная скотина!' },
      ];
    }();
    
    function showNextMsg() {
      let m = msg.next(); // получаем следующее сообщение
      if (!m.done) { // выводим его
        userName.textContent = m.value.name;
        userMessage.textContent = m.value.txt;
      }
    }

    https://jsfiddle.net/Stalk/8gm3y9w7/
    Ответ написан
    Комментировать
  • Как написать условие - диапазон вне диапазона?

    Stalker_RED
    @Stalker_RED
    (x<a && y<a) || (x>b && y>b)
    То есть обе границы первого диапазона меньше, или больше, чем границы второго.
    Если известно, что x всегда меньше, чем y, то можно короче
    y<a||x>b
    Ответ написан
    3 комментария
  • Замыкания не существует?

    Stalker_RED
    @Stalker_RED
    Я немного добавил наглядности
    function one() {
      const oneVar = 'Hello!'
      let counter = 0;
      console.log('функция one работает прямо сейчас, в счетчике', counter)
    
      function two() {
        console.log(oneVar, ++counter)
      }
      
      console.log('функция one почти завершилась, в счетчике все еще ', counter);
      return two
    }
    
    const three = one();
    console.log('функция one точно завершилась, даже return сработал');
    console.log('в переменной three сейчас функция two()');
    console.log(three);
    
    
    three();
    three();
    three();
    console.log('обожемой, мы видим как менялась переменная в уже завершенной функции. чераная магия? нет - это называется замыкание!');

    выхлоп:
    "функция one работает прямо сейчас, в счетчике", 0
    "функция one почти завершилась, в счетчике все еще ", 0
    "функция one точно завершилась, даже return сработал"
    "в переменной three сейчас функция two()"
    function two() {
      console.log(oneVar, ++counter)
    }
    "Hello!", 1
    "Hello!", 2
    "Hello!", 3
    "обожемой, мы видим как менялась переменная в уже завершенной функции. чераная магия? нет - это называется замыкание!"
    Ответ написан
    Комментировать
  • Как определить длину числа через регулярку?

    Stalker_RED
    @Stalker_RED
    let num = '12345678910111213';
    const x = Number(num); // преобразуем в число или NaN
    console.log(x < 1e12)

    если возможны отрицательные числа, то x > -1e12 && x < 1e12
    Ответ написан
    Комментировать
  • Как исправить ошибку c CORS защитой или как исправить ошибку fetch?

    Stalker_RED
    @Stalker_RED
    Посмотрите пример, там headers по другому указываются же.
    Ответ написан
    Комментировать
  • Как Map запоминает адрес ключа, который является объектом?

    Stalker_RED
    @Stalker_RED
    И почему нам Map.values() и Map.keys() возвращает пустой итерируемый объект?
    Для чего это?
    Нам всё равно потом приходится преобразовывать его в массив, чтобы получить данные и с ними уже что-то делать

    Делается он для экономии памяти, потому что нет смысла создавать ещё один массив с теми-же данными или ключами. Обычно можно итерироваться по тому самому "итерируему объекту", а преобразовывать в массив нужно реже.
    Ответ написан
    Комментировать
  • Как добавить условия в простой wishlist?

    Stalker_RED
    @Stalker_RED
    - как запретить добавлять товар, если он уже добавлен

    Сходу вижу три способа (их больше но это простые):
    1. перед копированием перебирать уже добавленные элементы, искать такой-же, выводить ошибку типа "такой уже добавлен". Придется перебрать все, прочитать из них номер, сравнить.
    2. создать массив в котором хранить ссылки на те элементы, которые вы клонируете.
    Не надо перебирать DOM, просто проверка if (myArr.includes(elem)) {}
    3. У уже добавленного элемента убирать плюсик.

    - как заменить "+" на "-" для товара, который уже добавлен

    1. Можно просто найти спан с плюсиком и заменить текст в нем. (в будущем наверное там будет не текст, а иконка, но смысл тот-же).
    2. Можно через CSS.

    спаны удалил, добавил три правила в css, удаление не делал:
    Ответ написан
    Комментировать
  • Как добавить класс всем элементам при использовании querySelectroAll?

    Stalker_RED
    @Stalker_RED
    Код можно немного Семён Окулов, сократить, использовав classList.toggle() вместо add и remove.
    let elements = document.querySelectorAll('.advantages__item');
    
    window.addEventListener('scroll', check, false);
    
    function check() {
        elements.forEach(el =>
          el.classList.toggle('show', window.scrollY > 300)
        );
    }

    А теперь добавьте все-таки console.log и посмотрте сколько раз вызывается эта функция при скролле, и вы каждый раз дергаете у этих элементов classList. Возможно стоит запоминать предыдущее состояние, и перебирать элементы только если оно изменилось.
    И, возможно, стоит добавить throttle.
    Ответ написан
    2 комментария
  • JS: addEventListener load и ajax, что делать если при работе ajax, это событие никогда не наступит?

    Stalker_RED
    @Stalker_RED
    Попробуйте повесить слушателей не на сами элементы, а на их родительский контейнер. Хоть сразу на document.
    https://jsfiddle.net/pjyhgae8/
    Ответ написан
    Комментировать
  • В консоль выводится null при попытке вывести html блок в консоль. Почему?

    Stalker_RED
    @Stalker_RED
    Обертка выводится, форма нет.

    Потому что формы нет на странице в момент поиска.
    Она добавляется в обертку позже, видимо создаётся или погружается скриптом.
    Как мне получить форму?

    Можете повесить на обертку MutationObserver, например.
    Ответ написан
    Комментировать
  • Как найти скрипт который добавляет инлайн стиль элементу?

    Stalker_RED
    @Stalker_RED
    Ещё можно MutationObserver, но тоже не всегда срабатывает.
    Ответ написан
    Комментировать
  • Как назначить текст элементом в HTML5 CANVAS?

    Stalker_RED
    @Stalker_RED
    В любом случае эти координаты границ кнопок должны где-то существовать. Если вы не хотите прописывать их вручную - можно взять какую-то библиотеку, которая умеет прятать этот процесс где-то у себя внутри. Практически любой игровой движок это может.
    Ответ написан
    Комментировать
  • Как сделать сортировку ul li через js?

    Stalker_RED
    @Stalker_RED
    const order = [5, 10, 2];
    const parent = document.querySelector('ul');
    const sorted = [];
    [...parent.children].forEach(el => {
      sorted[order.indexOf(+el.className.match(/lang-item-(\d+)/)[1])] = el;
    });
    sorted.forEach(el => parent.appendChild(el));
    Ответ написан
    Комментировать
  • Как закрыть модальное окно спустя 5 секунд после успешной отправки с cf7?

    Stalker_RED
    @Stalker_RED
    setTimeout(myFunc, 5000)
    5000 миллисекунд = 5 сек
    вместо myFunc - ваша функция, которая закроет модалку.
    Ответ написан
    Комментировать
  • Как в строке JS заменить нужные символы на случайный аналог из заданного массива?

    Stalker_RED
    @Stalker_RED
    const symbols = 'фывап'; // ваши символы
    const rnd = () => symbols[Math.floor(Math.random() * symbols.length)]; // получить случайный символ
    const re = /\D/g; // регулярка, ищущая любые не цифровые символы
    
    const magic = str => str.replace(re, rnd); // вот и все!

    https://jsfiddle.net/p25gzre9/
    UPD: увидел в комментариях, что для каждого символа своя замена. Сейчас подправлю
    вместо
    str.replace(re, rnd);

    вызываем функцию, которая сперва выбирает массив замен по букве, а потом выбирает из них случайную
    str.replace(re, retReplace);
    https://jsfiddle.net/p25gzre9/2/

    function getReplace() довольно длинная

    function getReplace(key) {
      const allSymbols = {
        a:  ['∀', '₳', 'Ä'],
        b:  ['Ᏸ', 'β', '฿', 'ß'],
        c:  ['ℭ', 'Ç', 'Ꮸ', '₡'],
        d:  ['Ɗ', 'Ď', 'Đ'],
        e:  ['£', 'Ē', 'ξ', 'Ê', 'È', '€', 'É', '∑', 'Ế', 'Ề', 'Ể', 'Ễ'],
        f:  ['ℱ', '₣', 'ƒ', '∮', 'Ḟ', 'ჶ'],
        g:  ['Ꮹ', 'Ꮆ', 'Ǥ', '₲'],
        h:  ['ℍ', 'ℋ', 'ℌ', 'ዙ', 'Ĥ', 'Ħ'],
        i:  ['ℐ', 'ℑ', 'Ï'],
        j:  ['ჟ', 'Ĵ'],
        k:  ['₭', 'Ꮶ', 'Ќ', 'Ķ', 'Ҝ', 'ﻸ'],
        l:  ['ℒ', 'ℓ', 'Ŀ', '£', 'λ', '₤', 'Ł', 'Ꮭ', '£', 'Ꮑ'],
        m:  ['ℳ', 'ʍ', 'Ḿ', '爪'],
        n:  ['ℕ', 'η', 'Ñ', 'Ŋ', 'Ń', 'ℵ', '₦'],
        o:  ['ტ', 'Ǿ', 'Θ', 'Ø', 'Ό', 'Ở', 'Ờ', 'Ớ', 'Ổ'],
        p:  ['ℙ', '℘', 'þ', '尸', 'Ҏ', '₱'],
        q:  ['ℚ', 'Q', 'Q'],
        r:  ['ℝ', 'ℜ', 'ℛ', '℟', 'ჩ', 'Ꮢ', '尺'],
        s:  ['Ꮥ', 'Ṧ', 'ى', '§', 'Ś', 'Ŝ', '₰', '∫', '$', 'ֆ'],
        t:  ['₸', '†', 'T', 'Ţ', 'Ŧ', 'ィ', '干', 'Ṫ', 'テ', '₮'],
        u:  ['∪', 'Ũ', '⋒', 'Ủ', 'Ừ', 'Ử', 'Ữ', 'Ự', 'Џ'],
        v:  ['∨', '√', 'Ꮙ', 'Ṽ', '\\/', '℣'],
        w:  ['₩', 'Ẃ', 'Ẁ', 'ώ', 'ω', 'Ŵ', 'Ꮤ', 'Ꮃ', 'ฬ', 'Ẅ', 'ѡ', 'Ꮚ', 'Ꮗ', 'ผ', 'ฝ', 'พ', 'ฟ'],
        x:  ['χ', 'ჯ', 'Ẍ', 'ẍ', 'ᶍ'],
        y:  ['ɣ', 'Ꭹ', 'Ꮍ', 'Ẏ', 'ẏ', 'ϒ', 'ɤ', '¥', 'り'],
        z:  ['ℤ', 'ℨ', 'ჳ', '乙', 'Ẑ', 'ẑ', 'ɀ', 'Ꮓ'],
      };
      const symbols = allSymbols[key];
      return symbols[Math.floor(Math.random() * symbols.length)];
    }
    Ответ написан
    Комментировать
  • Как сделать отдельную проверку на каждый checkbox?

    Stalker_RED
    @Stalker_RED
    Зачем все так сложно?
    Зачем писать проверку на пустоту, если есть required?
    Зачем самому собирать данные со всех полей, если есть $(form).serialize() ?
    Зачем добавлять к каждому полю id, если можно просто получать данные из текущей формы, а не по всей странице?
    У вас 90% кода можно просто выбросить.
    https://jsfiddle.net/ad86g4vu/1

    с подсветкой полей
    https://jsfiddle.net/ad86g4vu/2
    Ответ написан
    Комментировать
  • Какую карту выбрать?

    Stalker_RED
    @Stalker_RED
    Если нужна точность до района, то можно любую svg карту где каждый район отрисован отдельным элементом. Можно даже самому конвертировать. А там слушать клики и по event.target получать район.
    Ответ написан
    Комментировать
  • Как сравнить между собой несколько массивов и найти сходства и различия?

    Stalker_RED
    @Stalker_RED
    вы меня не поняли, мне нужно узнать как сравнить БОЛЬШЕ двух массивов. На ресурсах, предложенных вами есть сравнение только двух массивов, это я и сам нашел.

    Нужно больше конкретики, что и с чем вы хотите сравнить и сколько массивов всего (хоть примерно).

    Если сравнить каждый с эталонным, то просто пишете функцию сравнения и запускаете ее в цикле для всех.
    Предположим есть массивы myArrays = [a, b, c,d, e, f]; и нужно сравнить их все с "a"
    for( let i = 1; i < myArrays.length; i++) {
      myCompareFunc(a, myArrays[i]);
    }


    Предположим вы решили сравнить все со всеми, и у вас этих массивов заметно побольше двух. Тогда все сложно, и вот почему:
    предположим у вас три массива a, b, c.
    Тогда сравнить надо ab, ac, bc. Ввсего три сравнения, все просто.
    Предположим их четыре: a,b,c,d. Тогда сравнений будет ab,ac,ad,bc,bd,cd. Шесть штук, норм.
    Предположим, что нужно шесть сравнить. (a,b,c,d,e,f)
    ab,ac,ad,ae,af,bc,bd,be,bf,cd,ce,cf,de,df,ef - пятнадцать штук. Вы уже начинаете что-то подозревать?
    6! / ((6-2)! * 2)
    Это называется сочетания.
    Уже для 10 будет
    10! / ((10-2)! * 2) = 45 сочетаний, и дальше это число будет расти.
    Ответ написан
    Комментировать
  • Почему не обновляются локальные данные внутри setInterval?

    Stalker_RED
    @Stalker_RED
    Как-то все запутано у вас, непонятно зачем.
    Отдельно пост через jQuery.ajax, и вместо того чтобы в ответе передать ваш message вы запрашиваете его отдельно. Почему-то уже не через jQuery, а через hxr.

    Через fetch не?
    fetch('/path/to/message.txt')
      .then((response) => response.text())
      .then((text) => {
        console.log(text);
      });
    При необходимости можно и заголовки, и прочие параметры настроить
    Наверное единственное преимущество которое осталось у XHR, и которго нет у fetch - возможность отследить прогресс передачи большого файла, чтобы отрисовать полосочку.

    А вообще, в целом, ваш код работает.

    Добавил пример с fetch, немного логирования, и пришлось заменить в jQuery.ajax post на get, так как plunker не поддерживает POST.
    Ответ написан
  • Как написать правильную логику обрезания в jquery?

    Stalker_RED
    @Stalker_RED
    Чтобы option не отображал, почту можно вырезать.
    document.querySelectorAll('#ChildGanderNameFilterId option')
      .forEach(el => {
        el.textContent = el.textContent.replace(/\s\S+@\S+/, '')
      });

    Чтобы какой-то инпут что-то там отображал, добавьте для начала этот инпут. У вас эти данные нигде кроме разметки не сохранены? Можно их не просто вырезать, а сохранить в какой-нибудь массив, или в data-атрибуты переписать.
    Ответ написан