Question

我不知道我的编码有什么问题，看起来我的.js文件无法在我的html文件中激活。请帮帮我。

可以忽略其余的，我只是想在html中激活我的Javascript文件。

var num1 = 0;
var num2 = 0;
var sum = 0;

function randomNumber(){
num1 = Math.floor((Math.random() * 10) + 1);
num2 = Math.floor((Math.random() * 10) + 1);
$("#number1").text(num1);
$("#number2").text(num2);
sum =  parseInt(num1) + parseInt(num2);
}

randomNumber();

   $(":button").click(function () {
    var text = $(":text").val();
    if(text == sum)
    {
      alert("Correct");
      randomNumber();
      $(":text").val("");

    }
    else
    {
        alert("Wrong");
        randomNumber();
        $(":text").val("");
    }

});

它无法链接到我的html文件。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lab Report</title>
<script src="jquery.js"></script>
<script src="myscript1.js"></script>

<style>
body{font-size:40px;
text-align:center;
background-color: #FC6;}
table {margin-top:200px;
background-color:white;}
td { width:150px;}
input {font-size:20px;}
span {font-size:40px;}
#correctScore{
    background-color:green;


}
#wrongScore{
    background-color:red;

}
</style>
</head>

<body>


<table width="800" border="1" align="center">
     <tr>

    <td colspan="6" align="right" id="timer"><span>Timer : 50 <span></td>


  </tr>

<tr>

    <td colspan="6" id="question"><span>Question 1/10<span></td>


  </tr>


    <tr>
    <td><span>Correct<span></td>
    <td  id="correctScore"><span>0<span></td>
    <td><span>Wrong<span></td>
    <td id="wrongScore"><span >0<span></td>
    <td></td>
    <td></td>

  </tr>
  <tr>
    <td><div id="number1">1</div></td>
    <td><div>+</div></td>
    <td><div id="number2">2</div></td>
    <td><div>=</div></td>
    <td><input type="text"></input></td>
    <td><input type="button" value="Check"></input></td>

  </tr>
</table>

</body>
</html>

Answer 1

我怀疑你得到404并且你的脚本根本没有加载，或者你的脚本抛出异常。您需要做的第一件事是确保使用开发工具成功下载所有资源，无论您使用什么浏览器。

您需要做的下一件事是将代码置于jquery ready函数中，因为您使用的是jquery。

$(function() { 
    //code goes here
});

如果它仍无法正常工作，请在浏览器开发工具中访问控制台，看看错误是什么。

Answer 2

故障很少。

正如iamkrillin指出的，如果你想修改DOM元素，你应该在DOM初始化后运行脚本。
$(":text").val()的返回值为字符串。尽管JavaScript不是强类型转换的，但是当您想要进行数字操作时，将字符串转换为int var text = parseInt($(":text").val());是安全的。

Edited example

一些建议

您可以使用alert();而不是console.log();来检查浏览器控制台中的输出。有关console.log的更多信息，请here。

Answer 3

您应该显示目录树的示例以提供详细信息

例如，当您使用<script src="jquery.js"></script>时，应确保jquery.js文件与file.html

位于同一目录中像这样：

yourApp
.      jquery.js
.      myscript.js
.      index.html

但无论如何，请进行测试：

在file.html
转到Network标签
按F5（重新加载）
验证是否已成功下载jquery.js和myscript.js

将我的.js文件与.html文件相关联

3 个答案: