JavaScript新手-为什么我的函数没有执行?

New to JavaScript - why won't my function execute?

本文关键字:执行 函数 我的 新手 为什么 JavaScript      更新时间:2023-09-26

我正在学习JavaScript入门课程,我遵循所有的方向,但函数没有执行。我在StackOverflow上查看了许多"JavaScript不会执行"的问题,其中没有一个包含可以解决我的问题的答案。

HTML头:

<!DOCTYPE>
<html>
<head>
<title>Monroe Public Library</title>
<link href="mplstyles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="random.js"></script>
<script>
/*
The showImg() function displays a random image from the 0.jpg through 9.jpg files. The
random image is designed to thwart hackers attempting to enter the library records data
base by requiring visual confirmation
*/
function showImg() {
    var imgNumber = randomInteger(9);
    // Return a random number from 0 to 9
    document.write("<img 'src=" + imgNumber + ".jpg' alt='' />");
}
</script>
</head>

这是我的HTML调用函数的部分。它应该调用四次,以便输出HTML字符串五次,并在网页上显示五个数字图像。

<table border="1" cellpadding="5" cellspacing="0">
<tr>
   <th>Username</th>
   <td><input size="20" /></td>
</tr>
<tr>    
   <th>Password</th>
   <td><input type="password" size="20" /></td>
</tr>
<tr>
   <td>As a final security check, enter the 5 numbers 
   you see displayed below.</td>
   <td><input size="6" /></td>
</tr>
<tr>
   <td colspan="2" class="center">
   <input type="button" value="View Library Records" />
   </td>
</tr>
<tr>
   <td colspan="2" class="center">
   <script>showImg();showImg();showImg();showImg();showImg();</script>
   </td>
</tr>
</table>
</div>

当我打开页面时,它没有输出任何东西;就像我写的一样,有脚本元素和函数调用。表格单元格只是显示为空。我在函数中放入了一个消息框,看看它是否输入了这个消息框,它确实输入了,但是消息框只出现了一次(不管我调用函数多少次)。

JavaScript文件(random.js)以及HTML都提供并工作,所以我只包含了相关的部分。

不确定这是否相关,但您有"<img 'src="而不是"<img src='"

除此之外,定义

function randomInteger(rng) {
    return Math.round(Math.random() * rng);
}

并将document.write行更改为

document.write("<b>" + imgNumber + ".jpg</b> ");

这一行

 document.write("<img 'src=" + imgNumber + ".jpg' alt='' />");

撇号放错了位置。应该是

 document.write("<img src='" + imgNumber + ".jpg' alt='' />");

<table border="1" cellpadding="5" cellspacing="0">
<tr>
   <th>Username</th>
   <td><input size="20" /></td>
</tr>
<tr>    
   <th>Password</th>
   <td><input type="password" size="20" /></td>
</tr>
<tr>
   <td>As a final security check, enter the 5 numbers 
   you see displayed below.</td>
   <td><input size="6" /></td>
</tr>
<tr>
   <td colspan="2" class="center">
   <input type="button" value="View Library Records" />
   </td>
</tr>
<tr>
   <td colspan="2" class="center">
     <script>
     function showImg() {
        var imgNumber = Math.floor(Math.random() * 9);
        document.write("<img src='" + imgNumber + ".jpg' alt='' />");
     }
     showImg();showImg();showImg();showImg();showImg();
     </script>
   </td>
</tr>
</table>