脚本在两种情况下都显示文本

Question

我正在尝试在用户使用 adblock 时显示文本；我正在使用以下脚本；

ads.js

<script>var canRunAds = true;</script>

index.php

<script data-rocketsrc="ads.js" type="text/rocketscript"></script>
<script type="text/rocketscript">
  if( window.canRunAds === undefined ){
    var x = "Adblock is enabled, Please disabled to continue.";
    document.write (x);
  }
</script>

然而，我一直遇到的问题是，在定义变量和未定义变量时都会显示文本。

Answer 1

正如 Jacques 已经指出的那样，在检查未定义的变量时使用 typeof 运算符。参见 https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Operators/typeof。

在您的代码中，可以用

检查 window.canRunAds

typeof(window.canRunAds) === 'undefined'

因为我们可以确定，父对象 window 肯定是在您的上下文中定义的。如果它是一个我们不知道的对象，首先检查 typeof(window) === 'undefined' 以确保没有错误。

干杯！

Answer 2

在ads.js中设置window.canRunAds。您还需要使用 typeof 来检查 undefined.

ads.js

window.canRunAds = true;

index.php

<script src="/ads/ads.js"></script>
<script>
  if (typeof window.canRunAds === 'undefined') {
    var x = "Adblock is enabled, Please disabled to continue.";
    document.write (x);
  }
</script>

Answer 3

通知

如果不清楚，每个示例中的第一个内联 <script> 应该替换为 <script src="/ads/ads.js"></script> 以便工作。我在这里做不到。

tl;博士

在网站上，您的 ads.js 文件是使用 data-rocketsrc="ads.js" 异步加载的。将其替换为 src="ads.js" 以在下一个内联脚本执行之前同步加载它。您的页面（省略 CloudFlare）应如下所示：

<html>

<head>
  <title>Test Adblock</title>
  <script src="ads.js"></script>
</head>

<body>
  <script>
    'use strict';
    if (typeof canRunAds === 'undefined') {
      document.write('canRunAds is being blocked<br/>');
    }
  </script>
</body>

</html>

而https://flamingocams.com/ads/ads.js的内容应该是：

var canRunAds = true;

目前有以下内容：

<script>var canRunAds=true;</script>

我承认我不是 rocketscript 方面的专家，但我的猜测是使用该预处理器的脚本的运行上下文不是 window。运行它作为常规 JavaScript 保证在 window 上下文中同步执行。

回答

只需使用typeof canRunAds === 'undefined'。无需使用 window.canRunAds，因为 typeof 在检查未声明的变量时会抑制任何可能的 ReferenceError，即使在 strict mode:

中也是如此

<script>
  'use strict';
  var canRunAds = true;
  // to demonstrate the conditional `if` works
  // var someOtherFlag = true;
</script>

<script>
  'use strict';

  if (typeof canRunAds === 'undefined') {
    document.write('canRunAds is being blocked<br/>');
  }
  
  if (typeof someOtherFlag === 'undefined') {
    document.write('someOtherFlag is being blocked<br/>');
  }
</script>

但是，通常更常见的做法是让页面上的元素根据 CSS 有条件地可见，如下所示：

p.adblock-warning {
  display: none;
  color: red;
}

body.adblock p.adblock-warning {
  display: initial;
}

<script>
  // assume this couldn't run
  // var canRunAds = true;
</script>

<script>
  if (typeof canRunAds === 'undefined') {
    document.body.classList.add('adblock');
  }
</script>

<p class="adblock-warning">Adblock is enabled, Please disabled to continue.</p>

脚本在两种情况下都显示文本

Script is displaying text on both occasions

javascript

adblock

rocketscript

通知

tl;博士

回答