为什么我的点击计数器只计算第一次点击？答案

【问题标题】：Why does my click counter only count the first click?为什么我的点击计数器只计算第一次点击？
【发布时间】：2022-02-11 05:58:43
【问题描述】：

我有一个网站可以进行 wiki 速度运行。我有一种称为 wiki golf 的模式。游戏的目标是从随机页面点击 5 次以下即可进入耶稣维基百科页面。现在这段代码正在运行，但只运行一次。（点击计数器只到一个然后停止。）代码计算您在 iframe 内点击的次数。

    <head>
    <script src="https://code.jquery.com/jquery-3.1.1.js">

    </script>
    <meta charset="utf-8">
    <link rel="stylesheet" href="/game/game.css">
    <script src="/game/game.js">

    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
    <link rel="manifest" href="/site.webmanifest">


    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" integrity="sha512-9usAa10IRO0HhonpyAIVpjrylPvoDwiPUiKdWk5t3PyolY1cOd4DSE0Ga+ri4AuTroPR5aQvXU9xC6qOPnzFeg=="
     crossorigin="anonymous" referrerpolicy="no-referrer" />

</head>
<div id="message"></div>
<div id="invisible_layer">

</div>
<iframe src="https://en.wikipedia.org/wiki/Special:Random"  id="mainFrame" style="position:relative; top:0; left:0; bottom:0; right:0; width:100%; height:80%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;"></iframe>
</div>
<title> Wiki Golf | WikiRun </title>


<style>
    #invisible_layer {
        position: absolute;
        background-color: trasparent;
        width: 500px;
        height: 300px;
    }
</style>

</html>
<div class="stopwatch">
    <p>
        <h1>
            <b> Good Luck!! </b>
   </h1>
  </p>
  </div> 
  <p>Clicks: <a id="bellow">0</a></p>
</a>


  <script>
  let count = 0;
  
var myConfObj = {
  iframeMouseOver : true
}
window.addEventListener('blur',function(){
  if(myConfObj.iframeMouseOver){
    count += 1;
     document.getElementById("bellow").innerHTML = count;

  }
});


document.getElementById('mainFrame').addEventListener('mouseover',function(){
   myConfObj.iframeMouseOver = true;
});
document.getElementById('mainFrame').addEventListener('mouseout',function(){
    myConfObj.iframeMouseOver = false;
});
</script>

</script>

【问题讨论】：

您的 HTML 无效。你有多个<head> 标签，你有</body> 没有<body>
ClickUp() 函数定义在哪里？
我更新了我的代码，但仍然无法正常工作。

标签： javascript html iframe

【解决方案1】：

这是因为您触发了“模糊”事件的点击计数增加，我想，当您第一次点击 iframe 时，它只会触发一次，然后再也不会触发，因为 iframe 仍然是焦点。你为什么不使用一个简单的“点击”事件呢？

document.querySelector('iframe').addEventListener('click',function(){
  if(myConfObj.iframeMouseOver){
    count += 1;
     document.getElementById("bellow").innerHTML = count;

  }
});

【讨论】：

OP 在iframe 元素上已经有一个onclick 属性...
是的，但这似乎没有任何意义。
... 而且您不会从实际帮助 OP 提供他们拥有的代码中获得任何代表。 ;P
我试过了，但它甚至不会更新一次
这是我正在制作的网站。要进入该页面，请单击 SinglePlayer 按钮，然后单击 wikigolf 按钮，然后开始。 WikiRun.dubiscoding.repl.co