본문 바로가기

Programming/jQuery

[jQuery] .each() 로 배열 탐색 .each() 로 배열 탐색 .each()는 배열의 요소들을 모두 순차적으로 탐색이때 함수로 index와 element를 함께 넘겨 줄 수 있어 해당 요소들을 다룰 수 있다. $("li").each(function(idx, item){alert( idx + "번째 값은 " + $(item).html());}); 더보기
[jQuery] 숫자, 영문만 입력받기 숫자, 영문만 입력받기 $(document).ready(function() {$(".telnumber").keyup(function(){$(this).val($(this).val().replace(/[^0-9]/g,""));});$(".name").keyup(function(){$(this).val($(this).val().replace(/[^\!-z]/g,""));});}); 더보기
[jQuery] 배열에 포함되어있는지 검사하기 배열에 해당 값이 포함되어있는지 검사하기 $.inArray(value, array[, fromIndex])Array에서 특정값(value)을 찾으면 해당 ​index를 반환하고, 찾지 못하면 -1을 반환. var arrTmp = [1, 3, "lee", "kim" ];if($.inArray(3, arrTmp) != -1){alert("찾았음");}else{alert("없음");} 더보기
[jQuery] selectbox 선택값 변경시 값 구하기 selectbox 선택값 변경시 값 구하기 $("#selectbox id").change(function () { var str = ""; $("select option:selected").each(function (idx, item) { str += $(this).text() + " "; }); $("div").text(str);}) 더보기
[jQuery] Ajax 전송 Ajax 전송 AjaxAsynchronous JavaScript and XML 의 약어. 웹서버와 비동기식 통신을 이용해 대화영 어플리케이션을 구현하는 기법 Parametertype : GET or POSTurl : 전송하고자 하는 URLdata : 받는 곳의 방식에 따라 xml, json 등등의 데이터로 구성contentType : 보낼 데이터 포맷 형식dataType : 받을 데이터 포맷 형식success or failure : 이 안에 있는 function(data)는 값을 받으면 알아서 data 변수에 받은 객체가 할당됨. Usefunction Send() {$.ajax({type: "POST",url: "",data: "",//contentType: "application/json; charse.. 더보기
[jQuery] HTTP Body로 Ajax JSON POST Ajax JSON POST Client$.ajax({url: ".../api/test",type: "post",accept: "application/json",contentType: "application/json; charset=utf-8",data: JSON.stringify({'list': savedData}),dataType: "json",success: function(data) {// success handle},error: function(jqXHR,textStatus,errorThrown) {// fail handle}}); Server@RequestMapping(value = "/api/test", method = RequestMethod.POST, headers = {"Accept=ap.. 더보기
[jQuery] input box 기본문자처리 input box 기본문자처리 $('input[type = "text"]').each(function(){this.value = $(this).attr('title');$(this).addClass('text-label'); $(this).focus(function(){if(this.value == $(this).attr('title')) {this.value = '';$(this).removeClass('text-label');}}); $(this).blur(function(){if(this.value == '') {this.value = $(this).attr('title');$(this).addClass('text-label');}});}); HTML5 에서는 placeholder="" 옵션으로.. 더보기
[jQuery] checkbox 관련 jQuery checkbox 관련 check box 여부 확인$("input:checkbox[id = 'ID']").is(":checked") == true : false$("input:checkbox[name = 'NAME']").is(":checked") == true : false checked/unchecked 처리$("input:checkbox[id = 'ID']").attr("checked", true);$("input:checkbox[name = 'NAME']").attr("checked", false); check box 모두 체크/해제$("#checkAll").click(function(){ $("input[name=Name]:checkbox").each(function(){ $(this.. 더보기
[jQuery] select box 관련 select box 관련 select box id로 선택된 값 읽기$("#ID option:selected").val(); select box name으로 선택된 값 읽기$("select[name = NAME]").val(); 선택 값의 indexvar index = $("#ID option").index($("#ID option:selected")); select box에 option값 추가하기$("#ID").append("1번"); select box option의 맨 앞에 추가 할 경우$("#ID").prepend("0번"); select box의 html 전체를 변경할 경우$("#ID").html("1번2번"); 직접 index 값을 주어 selected 속성 주기$("#ID option:eq(1.. 더보기
[jQuery] when() 함수 jQuery.when(defrreds) : deferreds에 대한 처리 후 콜백처리 $.when($.ajax("test.aspx")).done(function(){alert("ajax 처리 후 실행");}) 동시에 2개의 ajax를 콜하고 모두 성공적으로 종료한 후에 무언가를 실행해야 할 경우var when1 = $.ajax("test1.aspx");var when2 = $.ajax("test2.aspx"); $.when(when1, when2).done(function(){alert("when1, when2 처리 후 실행");}); done(), then()의 차이done() : ajax가 성공일때 콜백함수 호출$.when($.ajax("test.aspx")).done(function(){alert(.. 더보기

티스토리툴바