各位高手，请教做带图片下拉菜单问题

我模拟了一个，你使用的时候修改LEFT，Top等的数值，放到合适的位置。
提交的时候用get方法提交相应属性。如果用post方法再放一个隐藏input,
不懂的地方再发短消息问我。
<HTML>
<HEAD>
<style>
.a
{
BORDER-RIGHT: lightblue 1px solid;
BORDER-TOP: lightblue 1px solid;
LEFT: 280px; 
BORDER-LEFT: lightblue 1px solid;
WIDTH: 100px; 
BORDER-BOTTOM: lightblue 1px solid;
POSITION:  absolute; 
TOP:  37px; 
HEIGHT: 24px;
}
.b
{
FONT-SIZE: 9px;
BORDER-LEFT-COLOR:lightblue;
LEFT: 358px; 
BORDER-BOTTOM-COLOR: 
lightblue; 
WIDTH: 20px; 
COLOR: mediumblue; 
BORDER-TOP-STYLE: solid; 
BORDER-TOP-COLOR: lightblue; 
BORDER-RIGHT-STYLE: solid; 
BORDER-LEFT-STYLE: solid; 
POSITION: absolute; 
TOP: 39px;
HEIGHT: 20px; 
BACKGROUND-COLOR: white; 
BORDER-RIGHT-COLOR: lightblue;
BORDER-BOTTOM-STYLE: solid; 
FILTER: progid:DXImageTransform.Microsoft.Matrix(SizingMethod ='auto expand',FilterType=bilinear,Dx=0,Dy=0,M11=-1,M12=0,M21=0,M22=-1);
}
.c
{ LEFT: 280px; 
WIDTH: 100px; 
POSITION:  absolute; 
TOP:  60px; 
HEIGHT: 24px;
display:none;
cursor:pointer;
}
</style>
</HEAD>
<BODY>
<SELECT id=select1 >
<OPTION selected>111</OPTION>
<OPTION >222</OPTION>
<OPTION >333</OPTION>
</SELECT>
<INPUT id=select2  class="a">
<INPUT type=button value="▲" class="b" onclick="ddd(this);" title=""> 
<TABLE border="1" CELLPADDING=0 CELLSPACING=0 bordercolor="lightblue" class="c"  onclick="aaa(this);">
  <TR>
    <TD bordercolor="#FFFFFF"  onmouseover="bbb(this);"  onmouseout="ccc(this);" title="1">
<img src="http://expert.csdn.net/expert/images/rank/star1.gif">1星
    </TD>
</TR>
<TR>

    <TD bordercolor="#FFFFFF"  onmouseover="bbb(this);"  onmouseout="ccc(this);" title="2">
<img src="http://expert.csdn.net/expert/images/rank/star2.gif">2星
</TD>
</TR>
<TR>

    <TD bordercolor="#FFFFFF" onmouseover="bbb(this);"  onmouseout="ccc(this);" title="3">
<img src="http://expert.csdn.net/expert/images/rank/star3.gif">3星
    </TD>
</TR>
</TABLE>
<SCRIPT >
  function aaa(obj)
{
previousSibling(previousSibling(obj)).value= window.event.srcElement.innerText;
previousSibling(previousSibling(obj)).title= window.event.srcElement.abbr;
eee(obj);
}
function bbb(obj)
{ 
obj.borderColor="#FF0000";
}
function ccc(obj)
{
obj.borderColor="#ffffff";
}
function ddd(obj)
{
nextSibling(obj).style.display="block";
}
function eee(obj)
{
obj.style.display="none";
}
function nextSibling(obj)
{
for(i=1;i<obj.document.all.length;i++)
{
if(obj==obj.document.all(i))
{
return(obj.document.all(i+1))
}
}
}
function previousSibling(obj)
{
for(i=1;i<obj.document.all.length;i++)
{
if(obj==obj.document.all(i))
{
return(obj.document.all(i-1))
}
}
}
</SCRIPT>
</BODY></HTML>

解决方案 »

  1.   

    更正一下：
    function aaa(obj)
    {
    previousSibling(previousSibling(obj)).value= window.event.srcElement.innerText;
    previousSibling(previousSibling(obj)).title= window.event.srcElement.title;
    eee(obj);
    }
      

  2.   

    可以改成htc,我脚本里面用的都是相对的对象，没用对象名称，我有时间的时候再琢磨一下，现在要玩去了。
    dullwolf和superdullwolf都是我拉！
    ：）
    那个帐号不能回复三个以上的帖子，所以我用这个登陆了。
    要给分的话给dullwolf,我计划把那个帐号也弄成两星，好象三星没希望了。
    <HTML>
    <HEAD>
    <style>
    .a
    {
    BORDER-RIGHT: lightblue 1px solid;
    BORDER-TOP: lightblue 1px solid;
    LEFT: 280px; 
    BORDER-LEFT: lightblue 1px solid;
    WIDTH: 100px; 
    BORDER-BOTTOM: lightblue 1px solid;
    POSITION:  absolute; 
    TOP:  37px; 
    HEIGHT: 24px;
    }
    .b
    {
    FONT-SIZE: 9px;
    BORDER-LEFT-COLOR:lightblue;
    LEFT: 358px; 
    BORDER-BOTTOM-COLOR: 
    lightblue; 
    WIDTH: 20px; 
    COLOR: mediumblue; 
    BORDER-TOP-STYLE: solid; 
    BORDER-TOP-COLOR: lightblue; 
    BORDER-RIGHT-STYLE: solid; 
    BORDER-LEFT-STYLE: solid; 
    POSITION: absolute; 
    TOP: 39px;
    HEIGHT: 20px; 
    BACKGROUND-COLOR: white; 
    BORDER-RIGHT-COLOR: lightblue;
    BORDER-BOTTOM-STYLE: solid; 
    FILTER: progid:DXImageTransform.Microsoft.Matrix(SizingMethod ='auto expand',FilterType=bilinear,Dx=0,Dy=0,M11=-1,M12=0,M21=0,M22=-1);
    }
    .c
    { LEFT: 280px; 
    WIDTH: 100px; 
    POSITION:  absolute; 
    TOP:  60px; 
    HEIGHT: 24px;
    display:none;
    cursor:pointer;
    }
    </style>
    </HEAD>
    <BODY>
    <SELECT id=select1 >
    <OPTION selected>111</OPTION>
    <OPTION >222</OPTION>
    <OPTION >333</OPTION>
    </SELECT>
    <INPUT id=select2  class="a">
    <INPUT type=button value="▲" class="b" onclick="ddd(this);" title=""> 
    <TABLE border="1" CELLPADDING=0 CELLSPACING=0 bordercolor="lightblue" class="c"  onclick="aaa(this);">
      <TR>
        <TD bordercolor="#FFFFFF"  onmouseover="bbb(this);"  onmouseout="ccc(this);" title="1">
    <img src="http://expert.csdn.net/expert/images/rank/star1.gif">1星
        </TD>
    </TR>
    <TR>

        <TD bordercolor="#FFFFFF"  onmouseover="bbb(this);"  onmouseout="ccc(this);" title="2">
    <img src="http://expert.csdn.net/expert/images/rank/star2.gif">2星
    </TD>
    </TR>
    <TR>

        <TD bordercolor="#FFFFFF" onmouseover="bbb(this);"  onmouseout="ccc(this);" title="3">
    <img src="http://expert.csdn.net/expert/images/rank/star3.gif">3星
        </TD>
    </TR>
    </TABLE>
    <SCRIPT >
      function aaa(obj)
    {
    previousSibling(previousSibling(obj)).value= window.event.srcElement.innerText;
    previousSibling(previousSibling(obj)).title= window.event.srcElement.title;
    eee(obj);
    }
    function bbb(obj)
    { 
    obj.borderColor="#FF0000";
    }
    function ccc(obj)
    {
    obj.borderColor="#ffffff";
    }
    function ddd(obj)
    {
    nextSibling(obj).style.display="block";
    }
    function eee(obj)
    {
    obj.style.display="none";
    }
    function nextSibling(obj)
    {
    for(i=1;i<obj.document.all.length;i++)
    {
    if(obj==obj.document.all(i))
    {
    return(obj.document.all(i+1))
    }
    }
    }
    function previousSibling(obj)
    {
    for(i=1;i<obj.document.all.length;i++)
    {
    if(obj==obj.document.all(i))
    {
    return(obj.document.all(i-1))
    }
    }
    }
    </SCRIPT>
    </BODY></HTML>
      

  3.   

    哦，好象我跑题了，好象你要的是菜单，而不是select
      

  4.   

    参考这个吧
    http://expert.csdn.net/Expert/topic/3027/3027427.xml?temp=6.130618E-02
      

  5.   

    dullwolf(超级大笨狼过程版（★★）) &&  superdullwolf(超级大笨狼,每天要自强)
    I 服 you!!!!!!真是灌水高高高手!