button Test

====== jQuery ====== * description : jQuery 관련 내용 기술 * author : 주레피 * email : dhan@repia.com * lastupdate : 2020-03-18 ===== 속성 변경 ===== [[http://seras.tistory.com/97|jquery onclick 속성 변경]] \\ ===== Ajax ===== [[https://sas-study.tistory.com/191|[Jquery] 제이쿼리, $.ajax() 함수 활용. 비동기 통신]] \\ ===== Autocomplete ===== 자동완성 기능 \\ [[https://programmer93.tistory.com/2|검색어 자동완성 - jQuery Autocomplete 사용법 - 삽질중인 개발자]] \\ [[https://shplab.tistory.com/entry/jQuery%EC%A0%9C%EC%9D%B4%EC%BF%BC%EB%A6%AC-Autocomplete-%EC%82%AC%EC%9A%A9%EB%B2%95-%EB%B0%8F-%EC%98%B5%EC%85%98-%EC%82%B4%ED%8E%B4%EB%B3%B4%EA%B8%B0|[jQuery] 제이쿼리 Autocomplete(자동완성) 사용법 및 옵션 살펴보기]] \\ [[https://darkangelus.tistory.com/69|autocomplete 높이 고정]]\\ [[https://www.youtube.com/watch?v=hijqUHblMHs|jQuery UI Autocomplete: Hightlight Matching Text in jQuery UI Autocomplete]] \\ \\ ===== Case Study ===== ==== Button ==== 값 가져오기




    
        
        button Test

> 값 입력은 $(this).attr('value', ${value}); 형식으로 진행 [[https://huskdoll.tistory.com/69|jQuery 버튼값 가져오기]] ==== Click ==== How to remove "onclick" with JQuery


// Old Way(pre-1.7)
$(selector).attr("onclick", "").unbind("click");
// New Way(1.7+)
$(selector).prop("onclick", null).off("click");

[[https://api.jquery.com/click/|Official docs .click()]] ==== Closest(), parents() ==== [[https://ismydream.tistory.com/94|jQuery closest(), parents() 메소드의 차이]] \\ ==== DatePicker ==== DatePicker란 jQuery에서 제공하는 widget중 하나로, 날짜를 다룰 때 UI 형식으로 쉽게 날짜를 선택 하도록 도와주는 역할을 하는 widget이다 {{:wiki:form_datepicker.png?nolink&400 |}} (DatePicker를 사용하기 위해서는 기본적으로 다음의 3가지 File을 import해야 한다)


// jQuery UI CSS파일 
  
// jQuery 기본 js파일
  
// jQuery UI 라이브러리 js파일

DatePicker의 기본적인 코드는 다음과 같다


$(function() {
  $( "#testDatepicker" ).datepicker({
        buttonImage: "button.png", //옵션
        buttonImageOnly: true      //옵션 
  });
});

DatePicker 에서 사용 가능한 Option은 다음과 같다 [[http://www.nextree.co.kr/content/images/2016/09/jhkim-140522-datepicker-05.png|DatePicker 옵션]] ==== Each ==== [[https://webclub.tistory.com/455|jQuery - each() 메서드]] $.each(object, function(index, item){}); \\ 배열과 length속성을 갖는 배열과 유사 배열 객체들을 index를 기준으로 반복할 수 있습니다. \\ 첫번째 매개변수로 배열이나 객체를 받으며, 두번째 매개변수로 콜백함수를 받습니다. \\


var obj = { 
  daum: 'http://www.daum.net'
  , naver: 'http://www.naver.com'
};
$.each(obj, function(index, item){
  var result = '';
  result += index + ' : ' + item;
  console.log(result);
}]
출력 결과
daum : http://www.daum.net
naver : http://www.naver.com

$(selector).each(function(index, item{});


    Lorem ipsum dolor sit amet.
    Lorem ior sit amet.
    Lorem ipsum



$('.list li').each(function(idex, item){
    $(item).addClass('li_0' + index);
    // or
    $(this).addClass('li_0' + index);
});


myObject = { 'a':1, 'b':2, 'c':3 };
newObject = myObject.map(function (value, label) {
    return value*value;
});

// newObject is now { 'a':1, 'b':4, 'c':9 }


Old Way(pre-1.6)
$('input[name="${name}"]').attr('checked', false);
New War(1.6+)
$('input[name="${name}"]').prop('checked', false);


var valid = false;
$('#formName').find(':input:radio').each(function(){
    if($(this).prop('checked'))
        valid = true;
});

if(!valid)
  return false;


1. value.toString()
2. "" + value
3. String(value)


var selected_text = '111111';
$("#S option").filter(function() { return (this.text==selected_text); }).attr('selected', true);


$('selector').wrap("

").parent().html();  // div가 있는 경우
$('selector').parent().html();   // 적용