Question

我想列出关于事实的清单。当我点击按钮时，第一个事实应该由第二个替换，依此类推。但它不起作用。这是我的代码：

var facts = ['1. ', '2. ', '3. ', '4. '];

var print = document.getElementById('myfacts');
print.innerHTML = facts[0];

var i = 1;

function go() {
  'use strict';
  print.innerHTML = facts[i];
  i = (i + 1) % (facts.length);
}

这是我的HTML：

<section id="fakten">
  <div class="facts">
    <h1>My 4 facts</h1>
    <script src="facts.js"></script>  
    <p id="myfacts" class="myfacts"></p>
    <a id="click" href="index.html" onclick="go();">Next</a>
  </div>
</section>

但它不起作用。你能帮帮我吗？

Answer 1

<script src="facts.js"></script>

你正在盯着=的标志。

同时将href="index.html"更改为href="#"。

var facts = ["1. ", "2. ", "3. ", "4. "];

    var i = 1;
    var print = document.getElementById('myfacts');

    print.innerHTML = facts[0];

    function go() {
        "use strict";
        print.innerHTML = facts[i];
        i = (i + 1) % (facts.length);
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<section id="fakten">
    <div class="facts">
        <h1>My 4 facts</h1>
        <script src="facts.js"></script>  
        <p id="myfacts" class="myfacts"></p>
        <a id="click" href="#" onclick="go();">Next</a>
    </div>
</section>

Answer 2

我的猜测是你在创建之前正在寻找一个元素。更改顺序：

<p id="myfacts" class="myfacts"></p>
<script src="facts.js"></script>

另一种选择是使用（需要进行一些更改）：

document.addEventListener("DOMContentLoaded", function(event) { 
  // you code
}

除此之外，您需要从href="index.html"更改为href="#"，或防止默认行为。

Answer 3

我认为是因为href="index.html"，而是使用href="#"

var facts = ["1. ", "2. ", "3. ", "4. "];

    var i = 1;
    var print = document.getElementById('myfacts');

    print.innerHTML = facts[0];

    function go() {
        "use strict";
        print.innerHTML = facts[i];
        i = (i + 1) % (facts.length);
    }

<section id="fakten">
    <div class="facts">
        <h1>My 4 facts</h1>
        <script src="facts.js"></script>  
        <p id="myfacts" class="myfacts"></p>
        <a id="click" href="#" onclick="go();">Next</a>
    </div>
</section>

Answer 4

如果你打开一个控制台，是否说go没有定义？像这样定义：

var facts = ["1. ", "2. ", "3. ", "4. "];

    var i = 1;
    var print = document.getElementById('myfacts');

    print.innerHTML = facts[0];

    go = function() {
        "use strict";
        print.innerHTML = facts[i];
        i = (i + 1) % (facts.length);
    }

现在它已经全球化并且正在发挥作用。

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<section id="fakten">
    <div class="facts">
        <h1>My 4 facts</h1>
        <script src="facts.js"></script>  
        <p id="myfacts" class="myfacts"></p>
        <a id="click" href="#" onclick="go();">Next</a>
    </div>
</section>

＆＃13;

import os
import shutil

f_list = []

root = "path/to/directory"
root = os.path.abspath(root) 

for folder, subfolders, files in os.walk(root):
    for file in files:

       filePath = os.path.join(folder, file)
       f_list.append(filePath)


bigest_file = max(f_list,key=os.path.getsize)
new_path = "path/where/you/want/to/save"
shutil.copy(biggest_file,new_path)

＆＃13;

像这样污染全局命名空间是一种可怕的做法 - 不要这样做。这是出于测试目的。

问题的根源在这个问题的答案中解释：Uncaught ReferenceError: function is not defined with onclick

此代码中发生了一系列不良内容。您可以考虑以下事项：

为什么href到index.html？
为什么要使用链接？使用html5按钮。
为什么在函数中使用严格？（我没有看到原因。）

Answer 5

我能够通过将javascript包装在DOMContentLoaded侦听器的回调中并进行一些更改来执行此操作。这样在脚本执行之前DOM就已满载。它确保在脚本运行之前可以访问#myfacts和#click元素。我还将<a>更改为<button>，以避免被重定向到index.html并将onclick注册移入脚本本身。

标记：

<section id="fakten">
    <div class="facts">
        <h1>My 4 facts</h1>
        <script src="./js.js"></script>  
        <p id="myfacts" class="myfacts"></p>
        <button id="click">Next</button>
    </div>
</section>

Javscript：

document.addEventListener("DOMContentLoaded", function(event) {
    var facts = ["1. ", "2. ", "3. ", "4. "];
    var i = 1;

    var print = document.getElementById('myfacts');
    var button = document.getElementById('click');

    button.onclick = function () {
      "use strict";
      print.innerHTML = facts[i];
      i = (i + 1) % (facts.length);
    }

    print.innerHTML = facts[0];
});

JavaScript - 函数不会被调用

5 个答案: