Jquery[제이쿼리] append+click+val로 select_option추가하기

안녕하세요~ 주니주니 입니다.

오늘은 제이쿼리[jquery] append+click+val로 select_option추가 해보겠습니다.

위화면처럼 셋팅해주세요~

오늘은 간단하게 준비해봤습니다.

실행 모습입니다.
아직 기능이 없답니다.

===============================
$('.b1').click(function(){
   var Text_val = $('.t1').val();
   alert(Text_val);
===============================
class이름이 b1 버튼이 click되면 Text_val이라는 변수에 class이름이 t1즉
텍스트박스의  value의값이 Text_val에 저장하라 입니다.

실행해서 텍스트 박스에 값을넣고 실행을 하면 경고창으로 확인할수있습니다.

그럼 이제 값확인하는 문구는 주석처리하고 <select>태그의 option을 추가해 보도록할께요.
===============================
$('.s1').append('<option>'+Text_val+'</option>');
   $('.t1').val("");
===============================
class이름이 s1인 태그에 append맨뒤에  <option>'+Text_val+'</option>을 추가하라입니다.
※Text_val는 위에서 텍스트박스의 value값을 저장하고있는 변수입니다.
class이름이 s1인 태그는<select>입니다.
위에 코드를 보시면 기본적으로 <option>선택하세요.</option> 문구를 해놨습니다.
<option>선택하세요.</option> <== 뒷부분에 추가가된답니다.
그럼 실행을 해볼까요

안녕하세요. 를 입력하고 추가하기 버튼을 눌러볼께요.

추가버튼을 누르고나면 이렇게 선택하세요. 뒤에 새로운 옵션이 생기게된답니다.

그럼 1개더 입력해볼께요.

짠~ 이렇게 입력하고 추가하기 버튼을 누르면 계속 생긴답니다.
오늘은 제이쿼리[jquery] append+click+val로 select_option추가 해봤습니다.
그럼 다음에 또만나요~