Nasıl bir site anında javascript devre dışı bırakıldığını tespit edebilir?

SORU

24 Temmuz 2012, Salı

Nasıl bir site anında javascript devre dışı bırakıldığını tespit edebilir?

Bir sayfa yüklendiğinde, tarayıcı Javascript etkin olduğunda normalde, <noscript> etiket bir uyarı gibi bir şey yazmak için kullanırız ve istemci Javascript etkinleştirmek için söyle. Ancak, Facebook, bilesonrasen JS ile sayfa, bir bildirim alırsınız engelli anda etkin yük. Nasıl böyle bir şey yapabilir miyim?

GÜNCELLEME : Bu mekanizma artık Facebook kullanılabilir, ama daha önce de oldu, bu soruyu sormakta çok geç kaldım, ama eğer herhangi bir cevap bulunursa, gerçekten çok memnun olurum.

Denedim

Eğer cevabınız evet ise Javascript devre dışı olup olmadığını kontrol ediyor benim sayfa içinde bir kesimi, <noscript> içeriğini göstermek zorunda düşündüm.

Bunu Başarmak için bir sayfa oluşturdumCheckJS.html.

<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="refresh" content="0">
</head>
<body>
    <noscript>
       JS is disabled!
    </noscript>
</body>
</html>

Bu sayfa devam edecekferahlatıcıJS devre dışı bırakıldığında, ., ^strong>JS devre dışı!görünecektir.

Benim orijinal sayfa içinde bu sayfa ekleyin. Aşağıdaki denedim

1- .() yükleyin

KullandımBir WordPress kullanmak7 ** içinde div. Ancak, .load() <body> içeriğini yükler gibi görünüyorCheckJS.html. <head> eleman ve div içi dolu olmayacak içinde.

2 - iframe

Bazı arama yaptıktan sonra, bir yük için mümkün olan tek yol buldumTAMhtml sayfası<head> dahil olmak üzere<iframe>. bir kullanmaktır

<iframe src="CheckJS.html"></iframe>

Ancak, <meta http-equiv="refresh" content="0">CheckJS.htmletkiler Ana Sayfa, orijinal sayfa kendini yeniliyor başladı.

Eğer yenilemek için özgün sayfa zorlamadan <iframe> bunu kullanmak için elimizden gelirse, o zaman bu bir çözüm olabilir, ama eğer bu çözüm bulunmazsa bile, daha bir hissediyorumhileyerinegerçekçözüm.

GÜNCELLEME

Antony 's answer kanıtladı ben yanlış olduğunu hakkında iframe yeniler orijinal sayfa, tarayıcı gösteren canlandırıcı ama aslında onun değil, eğer bu o zaman, Javascript olabilir Kaçınılması, CheckJS.html ben sağladım yaptığı işi ve hatta daha iyi, <noscript> olacak gizli zaman JS etkinleştirildi. Yine de bütün bu iframe yaklaşım bir yenileme değil, her 10 saniyede bir ya da öylesine, meydana gelmedikçe (tarayıcı donabilir). yani kullanıcı dostu değilanında algılama.

CEVAP

8 ŞUBAT 2013, Cuma

CSS Çözüm

BakınDEMO. Ayrıca olarak kullanılabilir JS library.

Sürekli JavaScript ile element değiştirerek CSS animasyon dur. JavaScript devre dışı bırakıldığında, CSS animasyon devreye giriyor ve bir mesaj görüntüler.

^{21* Browser compatibility*: Krom, 5.0 , 12 , Safari 4.0 Opera 10 , IE Firefox}

<style>
.nojs_init { 
position: relative;
animation:nojs-animation 0.2s step-end;
-moz-animation:nojs-animation 0.2s step-end; /* Firefox */
-webkit-animation:nojs-animation 0.2s step-end; /* Safari and Chrome */
-o-animation:nojs-animation 0.2s step-end; /* Opera */
}

@keyframes nojs-animation
{
from {visibility:hidden;opacity:0;}
to {visibility:visible;opacity:1;}
}

@-moz-keyframes nojs-animation /* Firefox */
{
from {visibility:hidden;opacity:0;}
to {visibility:visible;opacity:1;}
}

@-webkit-keyframes nojs-animation /* Safari and Chrome */
{
from {visibility:hidden;opacity:0;}
to {visibility:visible;opacity:1;}
}

@-o-keyframes nojs-animation /* Opera */
{
from {visibility:hidden;opacity:0;}
to {visibility:visible;opacity:1;}
}
</style>

<body>
<div id="content"></div>
<div id="nojs" class="nojs_init"><noscript>JavaScript is <span style="font-weight:bold;">disabled</span>.</noscript></div>
</body>
<script>
document.getElementById("content").innerHTML = 'JavaScript is <span style="font-weight:bold;">enabled</span>. Try disabling JavaScript now.';

var elm = document.getElementById("nojs"),
    animation = false,
    animationstring = 'animation',
    keyframeprefix = '',
    domPrefixes = 'Webkit Moz O ms Khtml'.split(' '),
    pfx  = '';

if( elm.style.animationName ) { animation = true; }    

if( animation === false ) {
  for( var i = 0; i < domPrefixes.length; i   ) {
    if( elm.style[ domPrefixes[i]   'AnimationName' ] !== undefined ) {
      pfx = domPrefixes[ i ];
      animationstring = pfx   'Animation';
      keyframeprefix = '-'   pfx.toLowerCase()   '-';
      animation = true;
      break;
    }
  }
}

// Continuously replace element
function jsdetect() {
    var elm = document.getElementById("nojs");
    var newone = elm.cloneNode(true);
    elm.parentNode.replaceChild(newone, elm);
}

// Only apply to browsers that support animation
if (animation) {
    elm.innerHTML = 'JavaScript is <span style="font-weight:bold;">disabled</span>.';
    setInterval(jsdetect, 0);
}
</script>

Bunu Paylaş: