zoukankan      html  css  js  c++  java
  • 页面检测网络*连接- 网页基础模块(JavaScript)

    1. 方法一

     html 添加图片标签

    加载外站图片

        <img id="connect-test" style="display:none;" onload="conectSuccess()" onerror="conectError()" />
    

    加载成功执行 connectsuccess()函数;

    // 浏览器动态数据检测 联机执行函数
      function conectSuccess(){
        //
        //网络可访问时加载
        //document.write("<scr"+"ipt src="##.js"></sc"+"ript>");
        alert("Network connect!");
      }

    加载失败执行 conectError()函数; 

    // 浏览器动态数据检测未联机执行函数
    function conectError(){
        //网络不可访问时加载
        //
    
        //document.write("<scr"+"ipt src="##.js"></sc"+"ript>");
    
        alert("Network disconnect!");
      }

    模块添加主函数

      // 浏览器动态数据检测
      function connectionLisner()
      {
        var imgPath = "https://www.baidu.com/img/bd_logo1.png";
        var timeStamp = Date.parse(new Date());
        $("#connect-test").attr("src", imgPath + "?timestamp=" + timeStamp);
      }
    

    获取联机状态函数 经测试没有实现

    借鉴jb之家的方法。。。不不行! 

    // 获取连接状态
    function get_status(){
      var connection = navigator.connection||navigator.mozConnection||navigator.webkitConnection||{tyep:'unknown'};
      var type_text = ['unknown','ethernet','wifi','2g','3g','4g','none'];
    
      if(typeof(connection.type) == "number"){
        connection.type_text = type_text[connection.type];
      }else{
        connection.type_text = connection.type;
      }
      if(typeof(connection.bandwidth) == "number"){
        if(connection.bandwidth > 10){
         connection.type = 'wifi';
       }else if(connection.bandwidth > 2){
         connection.type = '3g';
       }else if(connection.bandwidth > 0){
         connection.type = '2g';
       }else if(connection.bandwidth == 0){
         connection.type = 'none';
       }else{
         connection.type = 'unknown';
       }
     }
    
    var html = 'Type : '+connection.type_text;
    html += '
    Bandwidth : '+connection.bandwidth;
    html += '
    isOnline : '+navigator.onLine;
    return html;
    }
    
    
  • 相关阅读:
    python+django+vue搭建前后端分离项目
    PC网页js调用本地应用程序
    mysql-connetor-c 自动创建数据库、数据库表的命令
    JMeter设置响应数据的编码格式
    VS2013常用快捷键
    WPF 实现 TextBox 只能输入数字并且不能使用拷贝功能
    WPF 先显示登录成功,验证成功后显示主窗口
    ListControl 设置表格行高与字体
    win7 删除多余启动项的方法
    设置编辑工具UltraEdit的背景色为护眼颜色
  • 原文地址:https://www.cnblogs.com/embaobao/p/10720847.html
Copyright © 2011-2022 走看看