맛집 여행 캠핑 일상 생활

jQuery 에서 AJAX 로 JSON DATA 를 전달할 때 데이터 필드명을 변수로 받아서 넘기는 방법입니다. function action_update(key1, val1, key2, val2) { var datas = {}; datas[key1] = val1; datas[key2] = val2; var request = $.ajax({ type: 'POST', data: datas, url: 'json_test.php', dataType: "json", success:function(result){ alert(result); } }); return false; } { key1:val1,key2:val2 } 형태가 먹히면 좋은데 안먹히니 위의 방법으로 사용하여야 합니다.

jQuery 달력 picker api 가 있는줄 모르고 어렵게 프로그래밍 했었는데 진작 알았더라면 좋았겠네요~ 출처 : https://api.jqueryui.com/datepicker/#option-dateFormat 샘플소스는 위의 이미지 처럼 나옵니다~

무슨 이유때문인지는 몰라도 onkeyup 이 안먹히는 경우가 있네요~ 크롬 브라우저를 너무 오래 사용해서 그런지 새로 설치한 크롬 브라우저에서는 잘 됩니다. 아무튼 위와 같은 코드가 안먹힐 때 jQuery 에서 처리하는 방법입니다. $(document).ready(function(){ $('input[name=inputField1]').on('keyup keypress',function(){ alert(this.value); }); }); 참 신기한 경우도 있네요~

인스타그램 iframe 에 표시하는 예제 소스코드입니다. insta_urls 배열에 미리 주소값을 넣어놓으면 사진이 바로 보입니다. 응용해서 사용하시면 됩니다.

select 태그에서 id 가 없고 name 만 있는 경우에 셀렉트 onchange 이벤트를 캐치하는 방법입니다. $(document).ready(function(){ $("select[name='sOption']").change(function(){ alert(this.value); }); }); v1 v2 v3 id="sOption" 이라면 $("#sOption") 으로 가능합니다.

이미지 src 경로에 해당 파일이 없으면 Not found 에러가 나는데 대체 이미지를 지정할 수 있습니다. $('img').error({param1:value1}, function(e){ $(this).unbind('error'); // 무한루프 방지 $(this).attr('src',e.data.param1); }) .click({url:link},function(e){alert(e.data.url);}); 위의 소스 코드를 보고 응용하시면 됩니다.

jQuery AJAX 로 자신의 도메인이 아닌 다른 외부도메인의 주소를 호출시 일반적인 방법으로 값을 가져올 수가 없습니다. 타도메인을 호출할 때는 dataType 을 jsonp 로 설정하여야 하고 PHP 에서는 callback 함수로 리턴하여야 합니다. example.html 예제1) jsonpCallback 을 설정한 경우 function myCallFunction(v) { alert(v.param1 + ", " + v.param2); } $(document).ready(function(){ var request = $.ajax({ type: 'POST', data: {param1:'v1',param2:'v2'}, url: 'https://www.ivps.kr/zipcode/ajax-request.p..

[jQuery] Detect Local IP javascript 로 로컬아이피를 알아내는 소스코드입니다. IP here https://www.whatismybrowser.com/ 여기에서 가져온 코드입니다. 한번 들어가보세요~ 2020.02.11 지금은 윈도우 업데이트 때문인지 몰라도 아이피가 이상한 헥사값으로 나오네요~

[jQuery] 상위 노드 parent 찾기 자바스크립트의 document.getElementByID 로 찾는게 아닌 상위의 태그를 찾는 방법입니다.아래의 예는 팝업을 닫는 예제입니다. 코드를 보시면 이해가 되실 겁니다.

jQuery 특정 Element 제외하고 선택하기 특정 id나 element를 제외하고 액션을 수행할 수가 있습니다.아래 예제를 보면 두번째, 세번째 div 를 제외한 나머지를 선택하는 jQuery입니다.jQuery("div").not("#div2, #div3").each(function(){$(this).css({'backgroundColor':'red'});}); div1div2div3div4div5

jQuery image cache load 문제 익스플로러는 load (javascript onload) 함수를 타지만, 크롬브라우저는 Cache 에 저장된 이미지의 경우는 타지를 않습니다.대신에 complete 라는 변수의 값으로 판단이 가능합니다.$("img").each(function(i){if(this.complete) { // 캐쉬된 이미지alert ( this.width );}else {$(this).load(function(){alert ( this.width );});}});위 코드 처럼 분기시켜서 적용하면 잘 됩니다.

XE jquery.min.js 충돌로 에러가 날때 XpressEngine 에서 /common/js/jquery.min.js 를 호출하는 데도 jQuery 가 동작 안할 때가 있습니다.다른 사이트에서 jquery.min.js 를 호출하면 어떤 곳은 먹히지만 또 어떤 곳은 충돌이 일어나서 안되는 곳도 있습니다. 원인은 jQuery 를 대체하는 $ 때문인데요~ $(window) => jQuery(window)$(document) => jQuery(document) 이렇게 $ 를 jQuery 로 치환하여 주면 됩니다.

jQuery 브라우저 크기에 맞게 이미지 크기 조절 브라우저가 리사이징 되더라도 이미지가 화면비율에 맞게 꽉 차도록 하는 소스코드입니다.

jQuery Form 값이 변경되었는지 체크하는 방법 jQuery 에서 bind change event 로는 액션에 의하지 않고 소프트적으로 value 값이 변경될 때는 캐치해내지 못한다.이럴때 아래의 방법으로 체크할 수가 있다.필요한 시점에 isChangedFormValue 함수로 체크하면 된다.

jQuery 브라우저 F12 키 막기 소스코드는 아래와 같다. 그런데 브라우저 메뉴에서 개발자도구를 실행하거나 다른 방법으로 소스 보기를 한다면 막을 방법은 없다. 그런데 귀찮아서 안 볼 수도 있긴하다~

jQuery 마우스 우측 드래그 선택 막기 jQuery(document).on('contextmenu', false) 로 하는 경우도 있는데다른 js 와 같이 사용할 때 on 이 에러나는 경우가 있다. 아래의 코드를 적용했다고 완전히 불펌을 막을 수 있는 것은 아니다.개발자 모드로 디버그 하면 안쪽 소스가 훤히 들여다 보인다는 것을 유념하자. jQuery(document).ready(function(e){jQuery(document).bind('contextmenu', function(e){return false;});jQuery(document).bind('dragstart', function(e){return false;});jQuery(document).bind('selectstart', funct..

jQuery custom Alert 사용하기 자바스크립트의 기본 함수인 alert 은 단순히 메시지만 뿌려주기 때문에 color 를 넣을 수도 없고 크기를 변경할 수도 없다.이럴때 jAlert 을 사용하면 사용자에 맞게 custom alert 팝업을 구현할 수가 있다.커스텀 alert 아래 버튼을 눌러보세요~ 커스텀 alert jQuery Alert http://labs.abeautifulsite.net 이 이제 안되는가 보네요~

jQuery ajax 비동기식 및 동기식 처리 방식 ajax 로 서버 처리 건수가 적다면 동기식이나 비동기 호출이나 상관이 없겠지만, 동시에 서버에서 처리해야 되는 데이터가 많은 경우라면 동기식이 나아보입니다. 그리고 순차적으로 처리를 해야하는 경우에도 동기식으로 처리하는게 맞을 것 같습니다. ▶ 비동기 처리 방식 ▶ 동기식 처리 방식 async 의 default 값은 true 입니다.

jQuery 배열 each click 처리 버튼을 다중으로 처리시 유용하게 사용할 수 있다. i값은 몇번째 배열인지 알수 있는 값이다. 눌러보세요~

jQuery 팝업 바깥영역 마우스클릭시 팝업 닫기 예제 티스토리랑 아래코드랑 뭐가 안맞는지 현재 보이는 페이지에서는 구현이 안되서 아래 코드로 대체하였다. 이 영역 밖에 클릭시 팝업이 닫힙니다.