STUDY/jQuery

STUDY/jQuery

[EasyUI] Parser - easyui에서 $.parser.parse(); 뜻

공식문서 : https://www.jeasyui.com/documentation/parser.php parser - Documentation - jQuery EasyUI $.parser.auto boolean Defines if to auto parse the easyui component. true www.jeasyui.com Parser EasyUI 구성 요소가 호출되는 위치에 따라 전체 페이지 또는 페이지의 특정 부분 내에서 적절하게 초기화되고 작동하는지 확인합니다. 이는 동적으로 생성된 콘텐츠를 처리할 때나 초기화 범위를 웹페이지의 특정 섹션으로 제한하려는 경우에 특히 유용합니다. 사용법 $.parser.parse(); // 모든 페이지를 구문 분석합니다. $.parser.parse('#cc');..

STUDY/jQuery

[jQuery] 태그 별 값 가져오는 방법

jQuery를 사용하여 값 가져오기 html 태그에 따라 값을 가져오는 방식이 다르다. 이번 포스팅은 jquery 메서드를 사용해 각 html 태그 별로 값을 가져오는 방법을 정리했다. 1. input 태그 text, password, email, number: val() 메서드를 사용합니다. const name = $("#name").val(); // "홍길동" radio: prop("checked") 메서드를 사용합니다. 남성 여성 const gender = $('input[name="gender"]:checked').val(); // "male" checkbox: prop("checked") 메서드를 사용합니다. 약관 동의 const agree = $("#agree").prop("checked");..

STUDY/jQuery

[jQuery] Uncaught TypeError: $.ajax is not a function 오류

분명 다른 곳에서 이상이 없는 코드였는데, 동일한 코드를 다른 곳에 붙여서 사용하다가 아래와 같은 에러가 발생했다. 452 Uncaught TypeError: ajaxRequest(...).then(...).catch is not a function 해결방법 slim버전은 일부항목이 없어서 정식버전으로하면 해결된다는 해결방법을 찾았다. jQuery 일반버전을 다운로드해서 프로젝트에 포함시켜 해결했다. 참고 출처 : https://stackoverflow.com/questions/18271251/typeerror-ajax-is-not-a-function TypeError: $.ajax(...) is not a function? I'm attempting to create an AJAX request. He..

STUDY/jQuery

[jQuery] 선택 요소의 좌표 .offset()

.offset() 문서를 기준으로 요소의 현재 위치를 가져오는 데 사용됩니다. .offset()방법은 다음과 같이 사용될 수 있습니다. 요소가 처음 로드될 때 요소의 위치를 ​​가져옵니다. 스크롤되거나 애니메이션될 때 요소의 움직임을 추적합니다. 다른 요소를 기준으로 요소를 배치합니다. 좌표를 가져오기 다음 코드는 ID가 있는 요소의 위치를 ​​가져옵니다 var offset = $(myElement).offset(); console.log(offset.top); console.log(offset.left); 위치 설정하기 .offset()메서드를 사용하여 요소의 위치를 ​​설정할 수도 있습니다. 예를 들어 다음 코드는 ID가 있는 요소를 myElement문서의 왼쪽 상단으로 이동합니다. $(myEleme..

STUDY/jQuery

[jQuery] dataType과 contentType 차이점 (422 에러 발생원인)

422 unprocessable entity ajax로 작업하고 post를 날렸는데, 422 unprocessable entity 에러가 발생했다. 왜 안되는지 못잡아서 한참 봤는데, contentType 미기재로 인한 ajax form 에러였다. function requestChat(messageText) { let request = {"input1" : messageText}; $.ajax({ url: 'url', type: 'POST', data: JSON.stringify(request), dataType: 'JSON', success: function(response) { console.log(response); }, error: function (error) { console.log(error..

STUDY/jQuery

[jQuery] 문자열 치환 알고리즘

// key와 value값이 있는 배열을 선언합니다. const keyValueArray = [ { key: 'apple', value: '사과' }, { key: 'banana', value: '바나나' }, { key: 'orange', value: '오렌지' }, // ... ]; // textarea 엘리먼트를 선택합니다. const $textarea = $('textarea'); // textarea에 입력된 값을 감지하는 이벤트 리스너를 등록합니다. $textarea.on('input', function() { let inputValue = $textarea.val(); // 입력된 값 for (const keyValue of keyValueArray) { const regex = new Re..

STUDY/jQuery

[jQuery] .html 개행 \n 적용 <br>

.html 사용시 개행문자 들어간 문자열 줄바꿈 적용 jQuery의 .html() 메소드는 텍스트를 HTML로 파싱하여 출력합니다. HTML에서는 일반적으로 태그를 사용하여 줄바꿈을 나타냅니다. 반면에, \n은 일반적으로 텍스트 에디터나 커맨드 라인 인터페이스에서 사용되는 줄바꿈 문자입니다. 웹 브라우저는 이 문자를 그대로 출력할 경우, 줄바꿈이 적용되지 않고 띄어쓰기만 적용되므로, HTML에서는 태그를 사용하여 줄바꿈을 나타냅니다. 따라서, .html() 메소드를 사용할 때 개행 문자 대신 태그를 사용하는 것이 웹 브라우저에서 올바르게 줄바꿈을 적용하는 방법입니다. 개행 문자를 태그로 변경하는 방법 // 개행 문자를 태그로 변환하는 함수 function nl2br(str) { return str.rep..

STUDY/jQuery

[jQuery] function(e) 의미

function(e) 의미 event관련 object를 받는 argument입니다. Query에서 , 현재 이벤트 개체의 e줄임말입니다 . event일반적으로 실행될 이벤트 함수의 매개변수로 전달됩니다. Demo: https://codepen.io/Gothburz/pen/jbxxao/ 출처 : https://stackoverflow.com/questions/10323392/in-javascript-jquery-what-does-e-mean

STUDY/jQuery

[AMCHARTS] input값을 받아 차트 데이터 추가 생성

input값을 받아 amchar3의 차트에 데이터가 추가되며 생성하는 코드 // var count = 0; var JsonData = []; $('#ageInput').on('input', function() { var num = $('#numInput').val(); count += 1; JsonData = { num: num, count: count }; var chartData = JSON.stringify(JsonData); console.log(chartData); chart.dataProvider.push(JsonData); chart.validateData(); }); .on() jQuery는 이벤트 처리를 포함하여 웹 개발자에게 다양한 기능을 제공하는 널리 사용되는 JavaScript 라이..

STUDY/jQuery

[jQuery] 2개의 클래스가 있는 요소 선택하기

아래와 같이 class가 두개 ~ 여러개 있는 요소를 선택하고 싶을때 두 클래스(논리적 AND와 같은 교차점)가 있는 요소만 일치시키려면 사이에 공백 없이 선택자를 함께 작성하면됩니다. $('.a.b') 순서는 관련이 없으므로 클래스를 바꿀 수도 있습니다. $('.b.a') 따라서 divID가 a클래스 b및 인 요소를 일치시키려면 c다음과 같이 작성합니다. $('div#a.b.c') 출처 : https://stackoverflow.com/questions/1041344/how-can-i-select-an-element-with-multiple-classes-in-jquery

STUDY/jQuery

[jQuery] onload 와 ready 차이점

$(document).ready(function(){ alert('ready'); }); $(window).onload(function(){ alert('onload'); }); 호출 시점의 차이 실행순서 : .ready() → .onload() 순으로 실행 호출시점 : $(document).ready 의 호출 시점 : 1~2번 과정이 완료되어 DOM Tree 생성이 완료된 후 호출 $(window).onload 의 호출 시점 : 모든 과정이 완료되어, 웹 페이지가 다 구성된 후 호출 웹 브라우저의 HTML문서 렌더링 과정 불러오기(Loading) 불러오기는 HTTP 모듈 또는 파일시스템으로 전달 받은 리소스 스트림(Resource Stream)을 읽는 과정으로 로더(Loader)가 이 역할을 맡고 있다..

STUDY/jQuery

[jQuery] trigger 함수를 사용한 강제 클릭 이벤트

.trigger() .trigger() 함수는 이벤트가 발생할 때 실행될 함수나 .bind() 함수로 연결된 어떤 이벤트 핸들러를 강제로 실행시켜 줍니다. A call to .trigger() 함수를 사용해서 사용자가 일으킬 이벤트를 임의적으로 순서에 따라 발생시킬 수 있습니다. .trigger( eventType [, extraParameters ] ) trigger을 이용한 강제 클릭 예제: $(document).ready(function(){ // trigger로 인해 실행되는 부분 $("#btn").bind("click", function(){ alert("클릭!"); }); // 강제로 클릭 이벤트 발생시키는 부분! $("#btn").trigger("click"); }); } 클릭 안 해도 됨...

ReCode.B
'STUDY/jQuery' 카테고리의 글 목록