Question

我正在为朋友/客户的披萨店建立一个网站。它是本地的，他希望拥有基本功能，而不是任何维护。因此我在静态html和css中构建它。

我遇到的问题是，当我尝试通过让onmouseover事件更改图像的src标记时，他的菜单一次出现一个部分，它实际上永远不会改变。

我设置它的方式是一个3乘3的菜单标题网格，每个200乘67像素。在每个上面我都有onmouseover =“displaymenu（〜）”，其中〜是1到9的数字，具体取决于按钮。该函数只需调用一个开关，并在每种情况下将图像的src更改为显示菜单相应部分的其他图像的下方。

我的功能设置如下：

function displaymenu(x) {
    switch (x) {
    case 1:
        document.getElementById("menuimage").src = "images/AppetizersMenu.jpg";
        break;
    case 2:
        //same as 1 except a different src, same for 3-9.

我试图改变的图像有id menuimage。此代码放在我的文档的<head>部分。我似乎无法让事情发挥作用，并寻找解决方案。如果javascript不是要走的路，请告诉我，我会做你的想法。

编辑：我已经尝试了3种最老的解决方案，但没有成功。有人能告诉我，是否只有我的电脑有这些问题而不是代码问题？

非常感谢-Elliot S

Answer 1

试

document.getElementById("menuimage").setAttribute('src','images/AppetizersMenu.jpg;');

或

document.getElementById("menuimage").src='images/AppetizersMenu.jpg';

Answer 2

您需要引用要分配给.src属性的值，以便将其解释为文字字符串：

document.getElementById("menuimage").src = "images/AppetizersMenu.jpg";

Answer 3

我认为这也会让你微笑

你的Switch无法正常工作！

function displaymenu(x) {
var x = parseInt(x); // MAGIC LINE
switch (x) {
case 1:
   $('#holder').hide();
    break;
case 2:
    //same as 1 except a different src, same for 3-9.

如何将鼠标上的图像更改为另一个图像

3 个答案: