首先,我不再是学生,并且出于其他目的进行此操作,因此请不要拖延帮助;)

我想将一个简单程序合并到我的网页中。我想要4个标记为右臂,左臂的按钮,激活语音并向前走。这些按钮上方将有一个框,其中显示了机器人的图像,并且当用户按下按钮时,我希望将不同的图像加载到该框中。

因此,如果按下右臂按钮,则需要显示机器人抬起右臂的图像。

因此,基本上我想要按钮要做的就是加载属于每个图像的图像。我假设Java是最佳选择?我有开放源代码的Java软件包,要将其嵌入到网页中,是否需要其他任何软件?我的网页是在Dreamweaver上完成的,并且我对html相当满意。如果有人能指出我正确的方向,将不胜感激.....谢谢

最佳答案

不要为此使用Java。使用JavaScript。像这样:

HTML:

<img src="one.jpg" id="firstImage" />
<img src="two.jpg" id="secondImage" />

​<button id="doSomething">Do Something</button>
<button id="doSomethingElse">​Do Something Else</button>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​


CSS:

​img {
    display: none;
}​


JavaScript:

var hideImages = function() {
    $('#firstImage').hide();
    $('#secondImage').hide();
};

$('#doSomething').click(function() {
    hideImages();
    $('#firstImage').show();
});

$('#doSomething').click(function() {
    hideImages();
    $('#secondImage').show();
});​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​


这实际上是在最初不显示图像,而仅显示按钮。然后,在单击每个按钮时,将显示相应的图像。 (并且所有其他图像都首先被隐藏,因为单击先前的按钮将显示先前的图像。)

当然,这是一个过于简单的概念证明。至少,您将希望使用更好的变量名:)这只是演示了如何在JavaScript中显示/隐藏图像以响应按钮单击的想法。 (这也假设使用jQuery,这是目前的安全假设。最简单的使用方法是使用标准a CDN link引用页面中的HTML script tag。)您可以see this code in action here(当然,虽然图像坏了。)

如果有很多按钮和很多图像,那么您也可以重构代码以减少重复性。也许将图像存储在数组中,并具有一个按钮单击处理程序,该处理程序可以将发送按钮与正确的数组元素相关联,依此类推。

10-07 19:07
查看更多