Проверка наличия интернет соединения html [дубликат]

169
04 сентября 2019, 00:40

На данный вопрос уже ответили:

  • Проверка подключения к интернету на JS 2 ответа

Есть страница html (лендинг) весит в локалке, не у всех пользователей есть интернет, нужно сделать что то вроде проверки есть соединение у пользователя или нет, к примеру если есть у человека интернет то на этой html странице в определнном месте выводится картинка подключение есть, если нет то др. картинка с надписью подключение отсутствует.

Answer 1

Как вариант, можно попробовать показать какую-либо картинку и если она не загружается, значит соединения нет. Рекомендую поменять ссылку на какую-либо другую картинку.

<div id="test"></div> 
 
  <script> 
    function doConnectFunction() { 
      console.log("connection"); 
      document.getElementById("test").innerHTML = '<img src="http://lorempixel.com/640/480/nature">'; 
    } 
 
    function doNotConnectFunction() { 
      document.getElementById("test").innerText = "Интернета нет!"; 
    } 
 
    var i = new Image(); 
    i.onload = doConnectFunction; 
    i.onerror = doNotConnectFunction; 
    //Поменяйте ссылку на любую другую 
    i.src = 'https://www.gravatar.com/avatar/f2c24d6cdf719af1599d800078f5b880?s=328&d=identicon&r=PG&f=1' + escape(Date()); 
  </script>

Можно проверить через условие

{i.onload ? doConnectFunction():doNotConnectFunction()}

Как вариант предлагаю рассматривать не innerHTML а просто поменять пути у картинки.

Answer 2

Так пробовали?

navigator.onLine ? console.log("Есть интернет") : console.log("Нет интернета")

READ ALSO
как повесить событие на часть элемента? Элемент Canvas
HTML

как повесить событие на часть элемента? Элемент Canvas

Есть элемент canvas, нужно чтобы событие клика отрабатывало только в одной части этого элементаПодскажите идеи, пожалуйста

 168
Привязка к каптче
HTML

Привязка к каптче

Как можно сделать так, чтобы до введения каптчи кнопка "зарегистрироваться" была не активна, а после ввода становилась активной?

 137
v-bind:key в v-for error
HTML

v-bind:key в v-for error

У меня есть переменная file_url в которая может содержать любое количество адресов для загрузки файлов или не содержать вовсеЯ пытаюсь вывести...

 169
HTML: абсолютные и относительные ссылки
HTML

HTML: абсолютные и относительные ссылки

В своей html'ке подключаю JS по абсолютной ссылке <script src="htttp://sitecom/js

 160