2011-03-08 5 views
0

4 개의 열에 선택 상자 값을 표시하려고합니다. 어떻게해야합니까? 로컬 서버에서 사용하겠습니다.표시 선택 상자 열

나는 내가하고 싶은 것을 보여줄 이미지가 있습니다.

이것은 내가 지금 가지고있는 것입니다.

1 http://www.thewebdesign.org/1a.png

내가

2 http://www.thewebdesign.org/2a.png

이로 변신을 시도하고는이 STANDART 선택 요소 (없는 경우 내가

<style type="text/css"> 
<!-- 

.myselectbox { 

    font-family: Tahoma; 
    font-size: 18px; 
    background-color: #F5F5F5; 


} 
    option { 
    font-family: Tahoma; 
    font-size: 18px; 
     background-color: #fef5e6; 
     padding:8px; 
     margin:5px; 

     border-top: 1px solid #ebdac0; 
     border-bottom: 1px solid #ebdac0; 
     border-right: 1px solid #d6bb86; 
     border-left: 1px solid #d6bb86; 
    } 
--> 
</style> 
</head> 

<body> 
<center> 
<select name="amount_no1" class="myselectbox" id="amount_no1" > 
       <option value="1">1</option> 
       <option value="2">2</option> 
       <option value="3">3</option> 
       <option value="4">4</option> 
       <option value="5">5</option> 
       <option value="6">6</option> 
       <option value="7">7</option> 
       <option value="8">8</option> 
</select> 
</center> 
</body> 
+0

불가능 ... 표준 HTML 요소의 자연을 어떻게 대체 할 수 있습니까 ?? – diEcho

답변

0

을 사용하고있는 코드입니다 어떤 종류의 플러그인), 나는 그것이 가능하지 않음을 두려워합니다.

+0

내가 사용할 수있는 플러그인을 아십니까? – emre

0

JS 코드 :

여기
document.getElementById("amount_no1").value = 4 
0

이 코드를 수정하는 빠른 시도 여기를 통해 찾아 볼 수 jQuery를 플러그인의 목록입니다. 의 standart 드롭 다운 상자의 스타일을 할 수 없기 때문 최적 아니,하지만 난 시간

<style type="text/css"> 

.myselectbox { 

    font-family: Tahoma; 
    font-size: 18px; 
    background-color: #F5F5F5; 


} 


ul { 
    float: left; 
    width: 12em; 
    margin: 0; 
    padding: 0; 
    list-style: none; 
} 

li { 
    float: left; 
    width: 6em; 
    font-family: Tahoma; 
    font-size: 18px; 
     background-color: #fef5e6; 

     padding:8px; 
     margin:5px; 

     border-top: 1px solid #ebdac0; 
     border-bottom: 1px solid #ebdac0; 
     border-right: 1px solid #d6bb86; 
     border-left: 1px solid #d6bb86; 

} 
</style> 
</head> 

<body> 
<div> 
<select name="amount_no1" class="myselectbox" id="amount_no1" onclick="document.getElementById('ul1').style.display='block'"> 
       <option value="1">1</option> 
</select> 
<ul id="ul1" style="display:none"> 
       <li onclick="document.getElementById('amount_no1').options[0].text = 2; 
       document.getElementById('ul1').style.display='none'">2</li> 
       <li value="3">3</li> 
       <li value="4">4</li> 
       <li value="5">5</li> 
       <li value="6">6</li> 
       <li value="7">7</li> 
       <li value="8">8</li> 
</ul> 
</div> 
</body>