Ответы пользователя по тегу JavaScript
  • Как распознать ссылку в строке?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Ага, я вроде понял.

    У ссылки есть некоторые атрибуты, опираясь на которые ты можешь ее распознать. Среди них:
    1. Протокол: http\s (в ответах есть пример)
    2. Домен + доменная зона (вот тут уже посложней, так как доменных зон овердомного)

    Проверять по доменной зоне и по принципам имя.зона не рекомендую. Из-за такого подхода я до сих пор держу пару ящиков с классово-верной зоной, чтобы иметь возможность входить в сервисы, которые не удосужились сделать норм проверку.

    Поисковая строка, к слову, тоже не идеальна, ибо работает по подобному принципу и легко можно улететь на какой-нибудь дот.com. Впрочем, никто не запрещает делать тебе плохой интерфейс, «ведь все так делают».

    Собсно, тебе надо собрать регулярку, которая будет проверять введенную пользователем строку во время ввода или по событию, скажем, отправки формы, это уже зависит от того, как ты реализовал, по условию, которое тебя устраивает. Ты можешь реализовать это от обратного принципа, собрав примеры ссылок, которые ты хочешь отловить и собрать под них регулярку. Поможет тебе в этом этот сервис.
    Ответ написан
    Комментировать
  • Почему сетка masonry срабатывает частично?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Вангуемс...:
    1. Последние элементы в новом div-е.
    2. Где-то в консоли у тебя вылез exception, но нам ты его не показала.

    Все же склоняюсь к первому.
    Ответ написан
    Комментировать
  • Можно ли остановить скролл части страницы когда закончился контент для отображения?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    CSS → Position: Sticky.
    Если у тебя вычисляемые размеры левой и правой части → присыпь немного JS.
    Ответ написан
    Комментировать
  • Можно упростить этот код?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Можно сократить, возможно отыграть каплю времени. Но упростить врядли. В плане, чтобы понятно было человеку, который плохо шарит в JS)

    Смотри сюда. А потом в левый сайдбар, там много интересного, что может сократить запись.
    Ответ написан
    Комментировать
  • Как сделать слайдер автоматическим и бесконечным?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Перемещать\копировать элементы из начала в конец и наоборот, в зависимости от движения.
    Ответ написан
    Комментировать
  • Как сделать анимацию при переходе на другую страницу?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Ты никогда не сведешь анимацию при перезагрузке страницы. Поэтому, чтобы она была плавной, тебе необходимо либо на Vanilla.js сделать реализацию без перезагрузки, т.е. в рамках одной страницы, либо использовать js-фреймворк типа Vue, React, Angular + анимация переходов между состояниями.

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

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    1. По факту отгрузки json стоит передать его в другую функцию.
    2. Которая получит данные и обработает в, идеале отсортирует по дате.
    3. Еще проще — сформировать массив из объектов, где будет:
    [
      {
        date: ...
         messages: [...]
      },
    ]

    Такой объект просто тупо легче вывести в шаблон.
    4. Далее вывести всю эту срань по условиям: дата + сообщения, в которых эта дата совпадает.
    Ответ написан
    Комментировать
  • Как решается проблема с дерганьем всего контента при открытии модального окна?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Ты описал дефолтное поведение открывашки модального окна на Bootstrap. Там задается overflow: hidden; для body в момент открытия окна, чтобы предотвратить прокрутку контента одновременно с прокруткой модального окна.

    Соответственно, что-о мне подсказывает, что ты используешь бут или другой фреймворк, который так делает, ибо новички до такой фичи редко догадываются.

    А если ты уже выстрелил себе в ногу сам, без всяких бутов, то смотри, кто именно вешает этот overflow, ты сам или скрипт какой-нибудь модалки, что ты встроил в проект.

    ЗЫ: при открытии модального окна это наиболее правильное поведение страницы, можно разве что, если тебя это сильно смущает задать поведение элементам страницы по transition свойству (не рекомендую).
    Ответ написан
  • Как контролировать состояния у каждого компонента vue?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Vue Vue-шкой. но ты обращаешься к одному и тому же ID на уровне сгенериного HTML.

    UPD: если не понял, то покликай на нижний чекбокс, а потом посмотри код.
    Смехуечки: ты обращаешься к одному и тому же ID, но делаешь это без уважения.
    Ответ написан
  • Быстрый поиск в таблице по сайте?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    пока так, потом поправим

    Самообман, такой самообман)

    К слову, не поверишь, но можно скопировать решение. Просто поправив классы, где надо. И то, не обязательно даже.

    Впрочем, ИМХО, лучше для таких вещей задействовать JS-фреймворк типа Vue. Кроме того, что у них в документации подобного плана поиск приводится, как образец, так еще и в конечном счете это достаточно удобно.

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

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    они в CMS, которую я использую, подключаются в PHP-сниппет внутри , либо перед и грузятся сразу на все страницы


    Раздели на файлы, поройся в логике формирования CMS-кой, задай в ее styles объекте только необходимое. Остальное грузи непосредственно вставкой link в шаблоне. Может быть сможешь влить в потом styles свои файлы, если нет, то посмотри, как поднять их внутрь тега head.

    Если совсем плохо — догружай JS-кой.
    Ответ написан
    Комментировать
  • Не получается дописать слайдер. Хелп?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    В принципе жить можно. Подход такой себе, хотя я его и чуть больше люблю, чем классические слайдеры.
    Сделать надо вот что, при инициализации раздай data- атрибуты каруселькам — так ты сможешь сопоставлять активный элемент с «кружочками».

    Ну и переставлять в начало требуемый элемент при выборе его не стрелками — это очень нехорошо.
    Ответ написан
  • Kак узнать сколько времени понадобится чтобы часовые стрелки пересекали друг друга?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Вопрос, конечно, интересный, если бы ты его правильно сформулировал. Хотя я вроде и понял, что ты хочешь. Получить пересечение минутной и часовой стрелки, может и секундной. Первое, что приходит в голову — считать считать по заведомо известному соотношению движения по окружности стрелок до их совпадения. Таким образом ты получишь размер пути минутной стрелки, чтобы она догнала часовую. То же самое с секундной.

    К слову, я глянул в гугол и надо же, алгоритм легко гуглится, если правильно задать вопрос.
    Ответ написан
  • Как бороться с undefined?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Тут немного для ума. А перед выводом достаточно доступно проверять тернарником, например:
    ...
    ocum += `<td>${cars[car].color ? cars[car].color : ''}</td>`;


    Или чуть жестче:
    ...
    ocum += `<td>${typeof cars[car].color != 'undefined' ? cars[car].color : ''}</td>`;


    Сравнивать да, надо со строкой, а при проверке получишь булево значение. Первый вариант проще и сработает даже, если у тебя false стоит. Может быть даже, если Null прилетел (не уверен), а второй ждет именно значение, или «не определено». Т.е. если придет false, то он его пропустит.
    Ответ написан
    7 комментариев
  • Как на vue реализовать зажатие по элементу?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    <... @mousedown.prevent="method" ...>
    А уже в методе засекать время, например и по условию удалять или нет. Все очень просто.

    Читать тут и тут.
    Ответ написан
    4 комментария
  • Вытащить вопросы/ответы?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Нус, смотри. Я вижу тут асинхронную загрузку, т.е. где-то в коде ты можешь найти обращения к API. Так как скорее всего у тебя будет ряд проблем в том, чтобы спарсить данные с такого сайта, то ты можешь покопаться в исходниках открытых (JS исходники это чаще всего, как открытая ладонь), и найти эти самые обращения и условия получения данных.

    А может быть даже найдешь документацию к API, если хорошо поищешь.
    Ответ написан
    Комментировать
  • Как забрать данные из Wix?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Если имеешь доступ к HTML формы, в action формы кинь ссылку на API своего сайта, который примет данные и обработает.
    Ответ написан
  • Как создать форму ввода данных на сайте?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Form, внутри которой input type checkbox\radiobutton (выбор да нет) + range (для ползунка) и кнопка либо button, либо input type submit.

    И кастомизировать внешний вид + немного JS, чтобы ползунок при вводе показывал текущее значение. Из коробки HTML так не умеет.
    Ответ написан
    Комментировать
  • При клике на блок внутри него должен появиться класс, как?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Чтобы добавлять\менять классы, используй toggleClass('class')\addClass('class')\removeClass('class').

    А чтобы реализовать missclick, обратись к документации про всплытие и перехват событий.
    Ответ написан
    Комментировать
  • Как изменить документ pdf с помощью js?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    1. Сделай верстку (не документ), куда придут данные → дальше на печать в PDF. Сам PDF формат не редактируемый.
    2. Либо смотри в сторону серверной генерации по шаблону.

    Резюмирую: тебе в исходниках нужен не PDF, а шаблон.
    Ответ написан
    Комментировать