0

友人/クライアントのピザ屋のウェブサイトを構築しています。それはローカルであり、彼は基本的な機能を持ちたいと思っています。したがって、静的なhtmlとcssで構築しています。

私が遭遇した問題は、onmouseover イベントで画像の src タグを変更して一度に 1 つのセクションを表示させようとすると、実際には変更されないことです。

私が設定した方法は、メニュー タイトルの 3 x 3 グリッドで、それぞれが 200 x 67 ピクセルです。それぞれに do 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 つの最も古いソリューションを試しましたが、成功しませんでした。コードの問題ではなく、私のコンピューターだけがこれらの問題を抱えているのか、誰か教えてもらえますか?

どうもありがとう - エリオット S

4

3 に答える 3

1

試す

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

また

document.getElementById("menuimage").src='images/AppetizersMenu.jpg';
于 2012-07-11T14:55:12.563 に答える
1

リテラル文字列として解釈されるように、.srcプロパティに割り当てている値を引用符で囲む必要があります。

document.getElementById("menuimage").src = "images/AppetizersMenu.jpg";
于 2012-07-11T14:56:24.070 に答える
0

これも笑顔になれると思います

スイッチが機能していませんでした。

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.
于 2012-07-11T15:50:42.893 に答える