[js]셀렉트박스의 옵션 이동

셀렉트박스의 옵션들을 옮기는 함수입니다. ^^
당연히 자작입니다. -_-)v

# 스크립트 :

function menuMove(id,mode) {
  // mode can be 'first', 'last', 'up', 'down'
  var obj = document.getElementById(id);
  var idx = obj.selectedIndex;
  if (idx < 0) idx = obj.selectedIndex = 0;

  var opt = obj.options[obj.selectedIndex];

  switch (mode) {
    case 'first':
      obj.insertBefore(opt, obj.options[0]);
      break;
    case 'last':
      obj.appendChild(opt);
      break;
    case 'up':
      if (idx > 0) obj.insertBefore(opt, obj.options[idx-1]);
      break;
    case 'down':
      if (idx < obj.options.length-1) obj.insertBefore(obj.options[idx+1], opt);
      break;
  }
}

# 예제:

<select id="s" size="8">
  <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>
</select>
<div>
  <a xhref="javascript:menuMove('s','first')" mce_href="javascript:menuMove('s','first')"  >처음</a> |
  <a xhref="javascript:menuMove('s','up')" mce_href="javascript:menuMove('s','up')"  >위로</a> |
  <a xhref="javascript:menuMove('s','down')" mce_href="javascript:menuMove('s','down')"  >아래로</a> |
  <a xhref="javascript:menuMove('s','last')" mce_href="javascript:menuMove('s','last')"  >마지막</a>
</div>

댓글을 남겨주세요

This site uses Akismet to reduce spam. Learn how your comment data is processed.