본문 바로가기

Javascript

사파리나 크롬의 뒤로가기 체크 window.onpageshow = function(event){ if (event.persisted || (window.performance && window.performance.navigation.type == 2)){ // 사파리 or 안드로이드에서 뒤로가기로 넘어온 경우(캐시) window.location.reload(); } }; onpageshow는 page 호출되면 캐시든 아니든 무조건 호출됨 사파리의 경우 뒤로가기 하면 캐시를 이용해 화면 보여주는데 이때 event.persisted 가 true임 그외 브라우저(크롬만 해봄;)에서는 window.performance && window.performance.navigation.type == 2 이걸로 뒤로가기인지 체크 가능하다. 출처 : h.. 더보기
jQuery create form var $form = $(""); $form.append(''); $form.attr("action","localhost"); $form.attr("method","post"); $('body').append($form); $form.submit(); $('#helloForm').remove(); 미세먼지가 심해서 심난하다.. 더보기
for loop javascript var arr = ['a','b','c'];//var arr = [];for(var i=0, item; item = arr[i]; i++){ console.log(item);} 이렇게도 쓴다. 더보기
Javascript module, 공통 함수 만들기 정리 이번에 공통 함수를 만들 일이 생겼다. 처음에는 그냥 공통 스크립트 파일에 전역 변수로 만들려다가 문득 그건 좀 아닌 거 같다는 생각이 들었고제대로 만들어야 할 것 같아서 이번 기회에 정리를 좀 해볼까 한다.출처는 대부분이 '속 깊은 자바스크립트'다. 1. 그냥 전역변수로 만든 경우 문제점 - 다른 test() 함수가 있는 경우 덮어쓰기가 가능하다.아래와 같이 동일한 function 이 있는 경우 덮어쓰기 돼서 나중에 만든 test()가 호출된다. 또는 이런 즉시실행함수가 있는 경우도 덮어쓰기 가능.// 결과는 fake test fuction! haha의도치 않게 다른 개발자가 만든 함수 이름과 겹치는 경우 요런 문제가 발생할 수 있으므로, 전역 변수 사용은 이제 그만하자. 2. 모듈 생성 후 windo.. 더보기
jstl에서도 동적 매핑이 가능하다. javascript에서는 object 생성 후 동적으로 변수명을 만들어 접근할 수 있다.var obj = {key1 : 'value1',key2 : 'value2'}; // get itemobj.key1 또는 obj['key1'] // value1 키값이 없어도 할당이 가능하다 아래와 같이...obj['key3'] = 'value3'; 개인적으로 자바스크립트 쓰면서 참 편하다고 생각했던 부분인데... JSTL에서도 이처럼 동적으로 키값을 매핑할 수 있었다. 그동안은 안 되는 줄 알고 엄청난 삽질을 했었는데...JSTL도 어차피 javascript 기반인데 왜 안된다고만 생각했는지... 이걸 이제서야 알게 되다니 한심할 뿐 -_-;;; ${dynamicKeyName}아니면 바로 넣어줘도 된다. 더보기
CodeSchool Angular.js Level5 레벨 5에서는 모듈과 서비스에 대해서 공부한다. 일단 모듈 나누기부터~ products.js 파일을 만든 후 app.js에 있던 product 관련 내용들을 옮긴다. products.js(function() { var app = angular.module('store-directives',[]); app.directive("productDescription", function() { return { restrict: 'E', templateUrl: "product-description.html" }; }); app.directive("productReviews", function() { return { restrict: 'E', templateUrl: "product-reviews.html" }; });.. 더보기
CodeSchool Angular.js Level4 첫시간은 ng-include다. 여러 페이지에서 재사용해야 하는 경우 include를 이용하는게 좋겠지. index.html Description {{product.description}}이 부분에서 h4와 blockquote 내용을 밖으로 빼낸다. product-description.htmlDescription{{product.description}} 그리고 이렇게 include하면 완료. 여기서 주의해야할 점은 작은 따옴표로 감싸줘야 한다는 것! ng-include를 쓰는 대신 커스텀 태그를 만들어 쓰는 것도 가능하다. app.jsapp.directive("productDescription", function(){ return { restrict : 'E', templateUrl : 'product-.. 더보기
CodeSchool Angular.js Level3 레벨 3에서는 form과 model에 대해서 공부한다. app.js(function() { var app = angular.module('gemStore', []); app.controller('StoreController', function(){ this.products = gems; }); app.controller('TabController', function(){ this.tab = 1; this.setTab = function(newValue){ this.tab = newValue; }; this.isSet = function(tabName){ return this.tab === tabName; }; }); app.controller('GalleryController', function(){ t.. 더보기