Question

我遇到代码问题，必须在300x300px的框架内显示图像。此外，必须能够通过按键盘上的+和 - 来放大和缩小框架内的图像。我是一个mac用户，所以也许+＆amp;的关键代码 - 不正确，或者我向图像询问了错误的路径（它与脚本文件位于同一文件夹中）。请帮助和感谢观看！也许有更优雅的方法来完成这项任务......

<html>
<head>
    <script type="text/javascript">
    var speed = 4;
function showImage (src)
{
    var div = document.createElement ("div");
    with (div.style)
    {
        width = "300px";
        heigth = "300px";
        border = "2px solid black";
        textAlign = "center";
        overflow = "hidden";
    }
    document.body.appendChild(div);
    img = document.createElement ("img");
    img.src = src;
    img.width = 300;
    img.height = 300;
    div.appendChild (img);
}
function keyDown (key);
{
    var k = 0;
    if (key == 107 ) k = speed;
    if (key == 109 ) k = -speed;
    if (k != 0 )
    {
        img.width = img.width + k;
        img.height = img.height + k;
        img.style.margin = ((300 - img.height) / 2).toString() + "px";
    }
}
</script>
</head>
<body onkeydown="keyDown (event.keyCode)" onload="showImage ('image.jpg')">
</body>
</html>

Answer 1

使用您的控制台调试Javascript。这是Firefox和Chrome上的F12键，Safari遵循these说明。

图片无法加载，因为您的keyDown函数定义末尾有语法错误行23，;

Answer 2

最后，我完全理解了问题所在：键码107（缩放+）和＆amp; 109（用于缩放 - ）适用于Windows键盘。所以我找到了关于Mac的这些键的代码的信息（61用于缩放+＆amp; 173用于缩放 - ）并希望得到我想要的。

Realization

麻烦与JS代码

2 个答案: