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

时间:2015-10-13 18:41:21

标签: javascript function call

我正在参加一个入门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都已提供并且正常工作,因此我只包含相关部分。

2 个答案:

答案 0 :(得分:2)

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

除此之外,定义

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

并将document.write行更改为

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

对我来说很好。

答案 1 :(得分:1)

这一行

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

撇号不合适。它应该是

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

&#13;
&#13;
<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>
&#13;
&#13;
&#13;