체인 콤보(셀렉트)박스

2개 연결

<select id="crops1" name="crops1">
  <option value="">-- 선택 --</option>
  <option value="fruit">과일</option>
  <option value="vegetable">채소</option></select><select id="crops2" name="crops2">
  <option value="">-- 선택 --</option>
  <option class="fruit" value="apple">사과</option>
  <option class="fruit" value="banana">바나나</option>
  <option class="fruit" value="lemon">레몬</option>
  <option class="vegetable" value="onion">양파</option>
  <option class="vegetable" value="pumpkin">호박</option></select>

<script src="//code.jquery.com/jquery.min.js"></script>
<script src='//rawgit.com/tuupola/jquery_chained/master/jquery.chained.min.js'></script>
<script>$("#crops2").chained("#crops1");</script>

3개 연결

<select id="region" name="region">
  <option value="">-- 구분 --</option>
  <option value="domestic">국산차</option>
  <option value="imported">수입차</option></select><select id="maker" name="maker">
  <option value="">-- 제조사 --</option>
  <option class="domestic" value="hyundai">현대</option>
  <option class="domestic" value="kia">기아</option>
  <option class="imported" value="benz">벤츠</option>
  <option class="imported" value="bmw">BMW</option></select><select id="size" name="size">
  <option value="">-- 크기 --</option>
  <option value="large" class="hyundai kia benz bmw">대형</option>
  <option value="medium" class="hyundai kia benz">중형</option>
  <option value="small" class="hyundai kia bmw">소형</option></select>

<script src="//code.jquery.com/jquery.min.js"></script>
<script src='//rawgit.com/tuupola/jquery_chained/master/jquery.chained.min.js'></script>
<script>
  $("#maker").chained("#region");
  $("#size").chained("#maker");
</script>