javascript如何实现下拉列表

本帖最后由 BLACKNIAOR 于 2011-01-21 13:27:51 编辑

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

怎么知道select 选到了哪项，怎么把1.jpg,2.jpg,3.jpg加入到列表中
select 标签有个 value属性你把 1.jpg,2.jpg,3.jpg 加入每个option的value里再加一个onchange（）方法
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="javascript">
var img="1.jpg|2.jpg|3.jpg";
x=img.split("|");
z=x.length-1;
window.onload=function(){
var seclObj=document.getElementById("secl");
seclObj.onchange=function(){
document.all.cc.value=this.value-1;
document.all.ima.src=x[this.value-1];
}
for(var i=0;i<=z;i++){
seclObj.appendChild(new Option(x[i],i+1));
}
}
function next() {
  var y=parseInt(document.all.cc.value,10);
  y=y+1;
  if (y>z) {y=z;}
   document.getElementById("secl").selectedIndex=y;
document.all.ima.src=x[y];
  document.all.cc.value=y;
}
function prev() {
  var y=parseInt(document.all.cc.value,10);
  y=y-1;
  if (y<0) {y=0;}
document.getElementById("secl").selectedIndex=y;
  document.all.ima.src=x[y];
  document.all.cc.value=y;
}
</script>
<body>
<img src="1.jpg" name="ima">
<input type="hidden" name="cc" id="cc" value="0">
<br/>
<input type="button" onclick="prev()" value="上一页">
<input type="button" onclick="next()" value="下一页">
<select id="secl"></select>
</body>
</html>
添加了一个select标签，和一个window.load函数。
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />这段代码导致按钮乱码
还有图片名字没有加入到select的下拉列表中啊，一片空白。
应该点击后这样的。不然都不知道哪张跟哪张了1
2
3
4
5
6
//当文档装在完毕时执行代码
window.onload=function(){
//得到select对象
    var seclObj=document.getElementById("secl");
//给select对象添加onchange事件
    seclObj.onchange=function(){
        document.all.cc.value=this.value-1;
        document.all.ima.src=x[this.value-1];
    }
//给select对象添加option对象
    for(var i=0;i<=z;i++){
        seclObj.appendChild(new Option(x[i],i+1));
    }
}
我实在chorme下测试的。可能有些游览器不支持，不过看看哪行不支持，改下应该就ok了。
你所说的乱码，应该是你的html文件保存时没有按照utf-8保存。而是用默认的ansi保存了。在中文系统中ansi应该是gb2312编码。网页里的那个utf-8是告诉浏览器用什么编码来解析，你保存文件用gb2312解析用utf-8所以就会出现乱码，在保存html的时候选择下编码应该可以解决。
确实是这样，保存为UTF8就不乱了。但是还是没解决下拉列表选择图片时的序列空白问题。
seclObj.appendChild(new Option(x[i],i+1));要加什么才会出现01 02 03这样的下拉名单