当前位置: 首页 > Web前端 > JavaScript

使用JavaScript检测用户是否在线

时间:2023-03-26 20:35:14 JavaScript

寰俊鎼滅储銆愬ぇ鎷涜蛋鍚戜笘鐣屻€戯紝绗竴鏃堕棿涓哄ぇ瀹跺垎浜墠绔涓氬姩鎬併€佸涔犺矾寰勭瓑銆傛湰鏂囧凡鏀跺綍鍒癎itHubhttps://github.com/qq449245884/xiaozhi锛岄噷闈㈡湁瀹屾暣鐨勬祴璇曠珯鐐广€佽祫鏂欏拰鎴戠殑涓€绾垮巶鍟嗚璋堢郴鍒楁枃绔犮€傛湁鏃讹紝鎴戜滑闇€瑕佺煡閬撳綋鍓嶇殑缃戠粶鐘舵€佹潵鍋氫竴浜涗簨鎯呮潵鏀瑰杽鐢ㄦ埛浣撻獙銆傛湰鑺傝锛屾垜浠潵鐪嬬湅濡備綍浣跨敤JavaScript妫€娴嬬敤鎴锋槸鍚﹀湪绾裤€傛娴嬭繛鎺ョ姸鎬佹垜浠彲浠ヤ娇鐢╪avigator.onLineAPI鏉ユ娴嬭繛鎺ョ姸鎬侊紝瀹冭繑鍥炰竴涓竷灏斿€兼潵鎸囩ず鐢ㄦ埛鏄惁鍦ㄧ嚎銆傛敞鎰忥細璇锋敞鎰忔祻瑙堝櫒鐨勫疄鐜版柟寮忎笉鍚岋紝鍥犳缁撴灉鍙兘浼氭湁鎵€涓嶅悓銆倃indow.addEventListener('load',()=>{conststatus=navigator.onLine;});杩欐牱鎴戜滑涓嶇煡閬撳姞杞藉悗缃戠粶鐘舵€佹湁娌℃湁鍙樺寲锛屼笉澶悊鎯炽€傛垜浠彲浠ヨ闃呯绾垮拰鍦ㄧ嚎浜嬩欢鏉ョ洃鎺ц繖浜涚壒瀹氱殑鍙樺寲锛歸indow.addEventListener('offline',(e)=>{console.log('offline');});window.addEventListener('online',(e)=>{console.log('鍦ㄧ嚎');});绀轰緥鎴戜滑閫氳繃鑳屾櫙棰滆壊鐨勫彉鍖栨潵灞曠ず褰撳墠鐨勭綉缁滅姸鎬侊細鎮ㄥ凡杩炴帴馃敆

瀵瑰簲鐨刢ss:.status{background:#efefef;鏄剧ず锛氬脊鎬э紱璇佹槑鍐呭锛氬眳涓紱瀵归綈椤圭洰锛氬眳涓紱鏈€灏忛珮搴︼細100vh锛沝iv{濉厖锛?rem2rem锛涘瓧浣撳ぇ灏忥細3rem锛涜竟鐣屽崐寰勶細1rem锛涚櫧棰滆壊;瀛椾綋绯诲垪锛歊oboto銆?HelveticaNeue'銆丄rial銆乻ans-serif锛泒.online-msg{鑳屾櫙锛氱豢鑹诧紱鏄剧ず锛氬潡锛泒.offline-msg{鑳屾櫙锛氱孩鑹诧紱鏄剧ず锛氭棤锛泒}榛樿鏄剧ず鍦ㄧ嚎淇℃伅銆傜劧鍚庢垜浠坊鍔犱竴涓潯浠讹紝濡傛灉鐘舵€佸厓绱犳湁涓€涓绾跨被锛屾垜浠垏鎹袱涓猟iv銆?status{&.offline{.online-msg{鏄剧ず锛氭棤锛泒.offline-msg{鏄剧ず锛氬潡锛泒}}閭d箞锛屾垜浠浣曟牴鎹綉缁滅姸鎬佽繘琛屽垏鎹㈠憿锛?navigator.onLine){status.classList.remove('offline');}else{status.classList.add('offline');}};window.addEventListener('online',handleNetworkChange);window.addEventListener('绂荤嚎',handleNetworkChange);});浠g爜寰堢畝鍗曪紝杩欓噷灏变笉杩囧浠嬬粛浜嗐€傛渚嬪湴鍧€锛歨ttps://codepen.io/rebelchris...缂栬緫涓彲鑳藉瓨鍦ㄧ殑bug鏃犳硶瀹炴椂鑾风煡銆備箣鍚庝负浜嗚В鍐宠繖浜沚ug锛岃姳璐逛簡澶ч噺鐨勬椂闂村湪鏃ュ織璋冭瘯涓娿€傞『渚跨粰澶у鎺ㄨ崘涓€娆惧ソ鐢ㄧ殑BUG鐩戞帶宸ュ叿Fundebug銆傚師鏂囷細https://dev.to/dailydevtips1/...浜ゆ祦鏈夋ⅵ鎯筹紝鏈夊共璐э紝寰俊鎼滅储銆愭瘡鏃ユ劅鍔ㄤ笘鐣屻€戝叧娉ㄨ繖浣嶅噷鏅ㄨ繕鍦ㄦ礂纰楃殑娲楃鏅鸿€呫€傛湰鏂囧凡鏀跺綍鍒癎itHubhttps://github.com/qq449245884/xiaozhi锛岄噷闈㈡湁瀹屾暣鐨勬祴璇曠珯鐐广€佽祫鏂欏拰鎴戠殑涓€绾垮巶鍟嗚璋堢郴鍒楁枃绔犮€?/p>