폼 요소 선택자

jQuery 2012. 3. 13. 10:52
+= 왼쪽의 값에서 오른쪽을 더해서 왼쪽에 대입
-= 왼쪽의 값에서 오른쪽을 뺴서 왼쪽에 대입
*= 양쪽을 곱해서 왼쪽에 대입


:input
:text
:password
:radio
:checkbox
:submit
:image
:button
:file
:enabled
:disabled
:checked
:selected
1. 폼 요소 찾기/ 타입과 속성 알아보기

$(document).ready(function(){
  var result ="";
  //폼 요소가 있는 만큼 반복하자.
  //alert($(":input").size());
  $(":input").each(function(index){
   result += "태그명 : " + $(this).get(0).tagName //this.tabName
   + ", type 속셩명 : " + $(this).attr("type") + "\n";
  })
  alert(result);
 });


<input type="text" name="" /><br />
 <input type="radio" name="" /><br />
 <input type="password" name="" /><br />
 <input type="checkbox" name="" /><br />
 <input type="image" name="" /><br />
 <input type="reset" name="" /><br />
 <input type="submit" name="" /><br />
 <button>버튼</button>



2. 폼 속성값 복사 (배송지 정보를 복사할때등..)

.silver {background:#ccc;}


$(document).ready(function(){
  //모든 텍스트박스의 배경을 silver로 설정
  $(":text").addClass("silver");
  //첫번째 텍스트박스의 값을 두번째 텍스트박스로 복사
  $("#btnCopy").click(function(){
   $("#txtID").val($("#txtUserID").val());
  });
 });


 아이디 : <input type="text" name="" id="txtUserID" /><br />
 <hr />
 <input type="button" name="" id="btnCopy" value="복사" /><br />
 <hr />
 아이디 : <input type="text" name="" id="txtID" /><br />


'jQuery' 카테고리의 다른 글

웹접근성에 맞는 탭메뉴  (0) 2012.07.02
jQuery IE 버전에 Placeholder 적용하기  (0) 2012.06.26
각종 예제 사이트  (0) 2011.07.11
JQuery mobile  (0) 2011.07.07
배경색(투명) 깔고 위에 레이어 팝업 띄우기  (0) 2011.06.27
: