2012-01-09 5 views
0

HTML에서 select에 관한 질문이 있습니다. 이제 값이있는 두 개의 드롭 다운이 있습니다. 예를 들어 :HTML 드롭 다운 다중 열

<select name="healthy" id="healthy"> 
    <optgroup="fruit"></optgroup> 
    <option value="apple">apple</option> 
    <option value="pineapple">pineapple</option> 
    <optgroup="vegetables"></optgroup> 
    <option value="carrots">carrots</option> 
    <option value="tomato">Tomato</option> 
</select> 

대신 1 열에서이 그룹을 보여주는의 지금, 나는 다른 열에 표시 할 것입니다. 코드를 많이 변경하지 않고도 가능합니까?

편집 같은 대답을 두 번 받았지만 가능하지 않다면이 질문을 조금 변경합니다. 자신의 양식 요소를 만들 수 있습니까? 예를 들어 Actionscript, VB.Net, asp.Net에서 자신 만의 요소를 만들 수 있습니다. 나는 당신이 CSS로 레이아웃을 바꿀 수 있다는 것을 알고 있지만 그것은 해결책이 아닙니다. 그래서 제가 말하고자하는 것은, 선택에 기반하여 HTML에 대한 자체 요소를 만들고 싶습니다.

+0

이 열은 어떻게 구성됩니까? 즉,이 데이터는 어떻게 표 형식입니까? 누군가가 그러한 드롭 다운에서 행을 선택한 경우 두 열이 "선택됨"이어야합니다. 나는 @ EvilP의 대답에 동의하며,이 데이터가 양식에서 실제로 의미하는 것과 그것이 조직되어야하는 방식을 고려해 볼 가치가 있습니다. – David

+0

더 많은 것을 의미합니다 : <옵션 값 = "당근"> 당근 난 그냥 예를 주었기 때문에, 작동하지 않습니다 <= "토마토"옵션 값> 토마토 Marle1

답변

2

답변을 찾은 것 같습니다. 내 HTML 코드 :

<!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>Untitled Document</title> 
<link href="select.css" rel="stylesheet" type="text/css" /> 
</head> 

<body> 
<select name="sel" id="sel"> 
<optgroup label="group1"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
</optgroup> 
<optgroup label="group2"> 
<option value="5">5</option> 
<option value="6">6</option> 
<option value="7">7</option> 
<option value="8">8</option> 
</optgroup> 
</select> 
</body> 
</html> 

그리고 내 CSS 코드

@charset "utf-8"; 
/* CSS Document */ 

#sel{ 
    background-color:#FF0; 
    width:40px; 
    } 
#sel optgroup{ 
    background-color:#CFF; 
    display:inline-table; 
    width:20px; 

    } 

- 편집 - 문제 : IE 및 인라인 테이블을 인식하지 못합니다 크롬. 이러한 브라우저에서는 작동하지 않습니다.

0

내가 아는 한 불가능합니다. 하지만 서로 옆에 2 개의 선택 상자를 만들 수 있습니다!

+0

실제 드롭 다운에는 동적 옵션이 있습니다. 따라서 얼마나 많은 아이템이 있을지 결코 알 수 없습니다. – user993177

+0

예 동적으로 선택 목록을 동적으로 만들고 20 개 이상의 옵션이 있으면 다음 선택 목록을 만들고 20 개 이상 있으면 다음을 만들 수 있습니다. –

+0

200 개가 넘는 레코드 (가능한 내용)가 있으면 선택 목록이 10 개가됩니다. 나는 그것이 조금은 될 것이라고 생각한다. 하지만 내가하고 싶은 것은 양식에 대한 선택을하는 것입니다. 레이아웃을 변경할 수는 있지만 자신 만의 선택 목록을 만들고 싶습니다. Flex, Vb.net, ASP.net에서와 마찬가지로 자바 스크립트와 PHP로 가능 했을까? – user993177