わかりました。私のウェブサイトに、クライアントが広告(ウェブサイト)を20秒間表示する必要があるページがあります。彼が表示する必要のあるこのWebサイトをiframeタグで表示します。以上で、20秒のカウントダウンタイマーがあります。
また、ウィンドウのフォーカスが失われると、タイマーが停止することを確認しました。クライアントが実際にウェブサイトを閲覧していることを確認します。
しかし、私には問題があります。クライアントがIframe内のWebサイトで何かをクリックすると、カウンターは実際に停止します(つまり、フォーカスが失われます)。しかし、私はそれが起こらないようにしたいのです。タイマーが別のタップまたは別のウィンドウに移動した場合にのみ、タイマーのカウントダウンを停止したいのです。しかし、彼がIframe内のWebサイトのリンクをクリックした場合は、カウントを続けてほしいと思います。
これが私が使用するコードです:
<html>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var myInterval;
var seconds=20;
$(document).ready(function () {
$(window).focus(function () {
clearInterval(myInterval); // Clearing interval if for some reason it has not been cleared yet
if (!flag)
{ myInterval = setInterval(tick, 1000);}
}).blur(function () {
clearInterval(myInterval); // Clearing interval on window blur
});
myInterval = setInterval(tick, 1000);
});
function tick()
{
display();
if (seconds>0)
{
seconds--;
}
else
{
document.getElementById('TrafficHeader').innerHTML +="<?php include_once('Code.php');
?>";
clearInterval(myInterval);
}
}
function display()
{
$("#TrafficHeader").html(seconds);
}
</script>
<div id="TrafficHeader" style="height:100px; background-color:grey; padding:20px;"></div>
<iframe src="http://www.website.com" height="100%" width="100%" frameborder="0">
</iframe>
</html>
どんな助けでも事前に感謝します