求助：根据菜单值调用图片？

zenzi 2010-01-08 03:38:53

我写了一个页面，在页面上空出了六个已命名的图像占位。
用select菜单实现不同图片的直接调用
不知道问题出在哪里

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="./index.css" media="all" />
<script type="text/javascript" src="language.js"></script>

</head>

<body>

<div id="main">
<div align="left">

<p><img src="images/indexbg_r1_c1.gif" id="indexbg_r1_c1" alt="" />
<img src="" alt="" name="motto" width="800" height="449" id="motto" />
</p>

<form name="form1">
<div align="right">Select Language
<select name="language" id="language" onchange="document.form1.text1.value=this.options[this.selectedIndex].value">
<option value="1" selected="selected">中文</option>
<option value="2">Deutsch</option>
<option value="3">English</option>
</select>

</div>

</form>

<p> </p>
<p><img src="" alt="" name="ship" width="161" height="19" id="ship" /><img src="" alt="" name="environment" width="162" height="19" id="environment" /><img src="" alt="" name="technology" width="154" height="19" id="technology" /><img src="" alt="" name="MA" width="162" height="19" id="MA" /><img src="" alt="" name="communication" width="161" height="19" id="communication" /><img src="images/indexbg_r5_c1.gif" id="indexbg_r5_c1" alt="" /><img src="images/indexbg_r5_c3.gif" id="indexbg_r5_c3" alt="" /><img src="images/indexbg_r5_c5.gif" id="indexbg_r5_c5" alt="" /><img src="images/indexbg_r5_c7.gif" id="indexbg_r5_c7" alt="" /><img src="images/indexbg_r5_c9.gif" id="indexbg_r5_c9" alt="" /><br class="clearfloat" />
<img src="images/indexbg_r6_c1.gif" id="indexbg_r6_c1" alt="" />
<img src="images/indexbg_r6_c3.gif" id="indexbg_r6_c3" alt="" />
<img src="images/indexbg_r6_c5.gif" id="indexbg_r6_c5" alt="" />
<img src="images/indexbg_r6_c7.gif" id="indexbg_r6_c7" alt="" />
<img src="images/indexbg_r6_c9.gif" id="indexbg_r6_c9" alt="" /></p>
<p><br class="clearfloat" />
</p>
</div>
</div>

</body>
</html>

js文件如下

var lan;
var str1 = new string ();
var str2 = new string ();
var str3 = new string ();
var str4 = new string ();
var str5 = new string ();
var str6 = new string ();

lan = $('.form1 select[@name="language"]').val();
//填充不同图片
if (lan="1"){str1="images/index-cn.gif";
str2="images/index-cn_r3_c1.gif";
str3="images/index-cn_r3_c2.gif";
str4="images/index-cn_r3_c3.gif";
str5="images/index-cn_r3_c4.gif";
str6="images/index-cn_r3_c5.gif";
}
else if (lan="2"){str1="images/index-de.gif";
str2="images/index-de_r3_c1.gif";
str3="images/index-de_r3_c2.gif";
str4="images/index-de_r3_c3.gif";
str5="images/index-de_r3_c4.gif";
str6="images/index-de_r3_c5.gif";
}
else if (lan="3"){str1="images/index-en.gif";
str2="images/index-en_r3_c1.gif";
str3="images/index-en_r3_c2.gif";
str4="images/index-en_r3_c3.gif";
str5="images/index-en_r3_c4.gif";
str6="images/index-en_r3_c5.gif";
}

$('#motto').attr("src", str1);
$('#ship').attr("src", str2);
$('#environment').attr("src", str3);
$('#technology').attr("src", str4);
$('#MA').attr("src", str5);
$('#communication').attr("src", str61);

$('#motto').show();
$('#ship').show();
$('#environment').show();
$('#technology').show();
$('#MA').show();
$('#communication').show();

...全文