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

    @EvolveSunVolt
    В Safari на iOS есть строгие ограничения на воспроизведение звука в автоматическом режиме (без прямого взаимодействия пользователя). Эти ограничения были введены для улучшения пользовательского опыта и избежания назойливого воспроизведения звука без согласия пользователя.

    Чтобы обойти это ограничение, вам следует использовать воспроизведение аудио в ответ на явное пользовательское действие, например, нажатие кнопки. На основе этого события вы можете начать воспроизведение аудио. Вот пример использования JavaScript события click:

    // HTML
    <button id="playButton">Воспроизвести</button>
    
    // JavaScript
    document.getElementById('playButton').addEventListener('click', function() {
        playAudio(); // вызывает вашу функцию воспроизведения аудио
    });
    
    function playAudio() {
        // Ваш код для воспроизведения аудио, например, с использованием Web Audio API или HTML5 Audio API
    }


    Таким образом, пользователь должен явно взаимодействовать с вашим сайтом (например, нажатием кнопки), чтобы начать воспроизведение аудио. Это соответствует правилам безопасности браузера Safari на iOS.

    Если ваши потребности требуют автоматического воспроизведения, то вам, возможно, придется искать альтернативные платформы или рассматривать создание мобильного приложения, где такие ограничения отсутствуют.
    Ответ написан
    Комментировать
  • Почему window.open не работает на iphone?

    @EvolveSunVolt
    Проблема, возможно, связана с тем, что Safari на iPhone более строго обрабатывает функцию window.open. В частности, если window.open вызывается не в ответ на пользовательское событие (например, щелчок мыши), Safari может заблокировать всплывающее окно.

    Попробуйте использовать встроенную функцию window.location.href для перехода по ссылке в текущем окне, вместо открытия нового окна. Вот пример для функции openWhatsAppLink:

    function openWhatsAppLink(url) {
      const whatsappLink = `https://api.whatsapp.com/send?text=${encodeURIComponent('Моя корзина в магазине : ' + url)}`;
      window.location.href = whatsappLink;
    }


    Если вам все-таки нужно открывать ссылку в новом окне, убедитесь, что вызов window.open происходит в ответ на пользовательское событие, например, после клика пользователя. В этом случае, ваш текущий код должен работать, но если необходимо изменить, то подобный подход:

    $("#shared_wh").on("click", (e) => {
      e.preventDefault();
      $.post("ajax/share_cart.php", (data) => {
        if (data.success) {
          openWhatsAppLink(data.url);
        } else {
          alert('Что-то пошло не так');
        }
      })
      .fail(error => console.log(error))
    });
    
    function openWhatsAppLink(url) {
      const whatsappLink = `https://api.whatsapp.com/send?text=${encodeURIComponent('Моя корзина в магазине : ' + url)}`;
      window.open(whatsappLink, '_blank','noopener');
    }


    Обратите внимание на то, что window.open вызывается внутри обработчика события щелчка ($("#shared_wh").on("click", ...)).
    Ответ написан
    Комментировать
  • Как убрать знаки препинания в value и получить количество слов?

    @EvolveSunVolt
    Чтобы убрать знаки препинания из строки и посчитать количество слов, можно использовать регулярное выражение в методе replace(), которое заменит все знаки препинания на пробелы, а затем воспользоваться методом split() для разделения строки на массив слов. Вот пример кода:

    const input = document.querySelector('textarea');
    const text = input.value;
    const regex = /[^\w\s]|_/g; // регулярное выражение, которое находит все знаки препинания
    const sanitizedText = text.replace(regex, ' '); // заменяем знаки препинания на пробелы
    const words = sanitizedText.trim().split(/\s+/); // разделяем строку на массив слов
    const wordCount = words.length; // получаем количество слов
    console.log(wordCount);


    Здесь мы используем регулярное выражение [^\w\s]|_ для поиска всех знаков препинания и символов подчеркивания. Знак ^ в квадратных скобках означает "не", то есть мы ищем все символы, которые не являются буквами или пробелами. Затем мы используем метод replace() для замены всех найденных символов на пробелы. Затем мы используем метод trim() для удаления лишних пробелов в начале и конце строки, а метод split(/\s+/) для разделения строки на массив слов по одному или нескольким пробелам. Наконец, мы получаем количество слов в массиве с помощью свойства length и выводим результат в консоль.
    Ответ написан
    Комментировать
  • Как получить точный размер блока до тысячных пикселя?

    @EvolveSunVolt
    Возможно, точность измерения зависит от разрешения экрана и не может быть точнее определенного значения. Однако, есть несколько вариантов, которые можно попробовать:

    1. Использовать свойство getComputedStyle, которое вернет вычисленное значение CSS свойства. Например:

    $(function() {
      console.log(window.getComputedStyle($('.block')[0]).getPropertyValue('height'));
    })


    1. Установить размер блока с помощью CSS переменных и получить его значение через свойство getComputedStyle. Например:
    <div class="block" style="--height: 81.643px;"></div>


    .block {
      height: var(--height);
    }

    $(function() {
      console.log(window.getComputedStyle($('.block')[0]).getPropertyValue('--height'));
    })


    Этот подход позволяет задавать размеры блока с большей точностью, используя переменные CSS.

    1. Использовать единицы измерения, позволяющие более точное определение размеров, например, rem или em.

    Например, если размер шрифта установлен на 16px, то 0.001rem будет соответствовать 0.01px:
    <div class="block" style="height:0.001rem"></div>
    $(function() {
      console.log($('.block')[0].getBoundingClientRect().height);
    })


    Но следует учитывать, что использование таких единиц измерения может привести к проблемам с масштабированием и адаптивностью.
    Ответ написан
    Комментировать