2016-07-16 5 views
0

Ich hatte Code mit mir, um die Internetverbindung zu überprüfen und auch den Online-/Offline-Status in Label in der Zeit des HTML-Seitenladevorgangs anzuzeigen. aber es funktioniert nicht richtig. Also bitte hilf mir das Problem zu lösen. Hier ist das Skript um die Internetverbindung zu überprüfen.wie check internet verbindung und display in label in html?

enter code here 
<script type="text/javascript"> 

    function checkconnection() { 

    var status = navigator.onLine; 

    if (status) { 

    document.getElementById("LblText").value = "ONLINE"; 

    } 
else 
{ 

    document.getElementById("LblText").value = "OFFLINE"; 
    } 
    } 
    </script> 
i am also attaching label syntax below` 
enter code here` 
<label id="LblText">NO Text</label> 
i want to show label text online /offline according to internet connection availability. 
+4

Mögliche Duplikat [Überprüfen Sie, ob Internet-Verbindung mit Javascript Exists?] (Http://stackoverflow.com/questions/2384167/check-if-internet-connection-exists-with-javascript) – Iceman

+1

Mögliche Duplikat [Erkennen, dass die Internetverbindung offline ist?] (Http://stackoverflow.com/questions/189430/detect-that-the-internet-connection-is-offline) – Vidur

Antwort

0
<html> 
<head> 
    <title>Check Connection</title> 
    <style> 
     body { 
      margin: 0; 
      padding: 0; 
     } 
     #mainContainer { 
      border: 4px #007CA6 solid; 
      background-color: #D2F4FF; 
      width: 450px; 
      height: 300px; 
      text-align: center; 
     } 
     #mainContainer a { 
      background-image: url("//www.kirupa.com/images/giant_cloud.png"); 
      background-position: center 70px; 
      background-repeat: no-repeat; 
      color: #00BFFF; 
      display: block; 
      font-family: Arial,Helvetica,sans-serif; 
      font-size: 32px; 
      padding-top: 200px; 
      text-decoration: none; 
     } 
     #mainContainer a:hover { 
      text-decoration: underline; 
     } 
    </style> 
</head> 
<body> 

<div id="mainContainer">  
    <a href="javascript:void(0)">Check connection!</a> 
</div> 

<script> 

    var link = document.querySelector("#mainContainer a"); 
    link.addEventListener("mousedown", checkConnection, false); 

    function checkConnection(e) { 
     if (doesConnectionExist() == true) { 
      alert("connection exists!"); 
     } else { 
      alert("connection doesn't exist!"); 
     } 
    } 

    function doesConnectionExist() { 
     var xhr = new XMLHttpRequest(); 
     var file = "//www.kirupa.com/blank.png"; 
     var randomNum = Math.round(Math.random() * 10000); 

     xhr.open('HEAD', file + "?rand=" + randomNum, false); 

     try { 
      xhr.send(); 

      if (xhr.status >= 200 && xhr.status < 304) { 
       return true; 
      } else { 
       return false; 
      } 
     } catch (e) { 
      return false; 
     } 
    } 
</script> 
</body> 
</html> 
+0

Jayadeep ich überprüfe diesen Code indem ich .wenn ich Internet habe es zeigt. Verbindung existiert nicht! und auch wenn ich Internet nicht habe, zeigt es dasselbe. –

0

Rufst du die checkconnection() Funktion überall? Ihre Logik existiert, läuft aber nicht, weil Sie die Funktion nicht aufgerufen haben.

Versuchen Sie auch, .innerHTML oder .innerText anstelle von .value zu verwenden, es sei denn, Sie versuchen, ein Eingabefeld zu ändern.

<label id="LblText"></label> 
<script> 
    function checkConnection() { 
     if(navigator.onLine) { 
      status = 'Online'; 
     } else { 
      status = 'Offline'; 
     } 
     document.getElementById('LblText').innerText = status; 
    } 

    checkConnection(); 
</script> 
+0

Dieser Code funktioniert, aber er wird immer online angezeigt, wenn eine Verbindung nicht verfügbar oder verfügbar ist. Dies ist bereits oben von Iceman in Link –

+0

erwähnt. So klingt es wie Sie wollen etwas komplizierter als "ist meine Wifi-Verbindung". Sie könnten etwas wie https://github.com/alfg/ping.js verwenden und Ping-Timeouts verarbeiten. –

Verwandte Themen