HTML5 data- 와 jQuery

js API/jquery 2015. 8. 21. 15:35

# 사용방법 1>

<div id="list1" data-id="1" data-name="홍길동"> 오호호 </div>


jQuery

var obj = $('#list1');

var data_id = obj .data('id');

var data_name = ob.data('name');


# 사용방법 2>

<div id="list2" data-id="2" data-member-name="유관순"> 대한독립만세 </div>


jQuery

var obj2 = $('#list2');

var data_id = obj2.data('id');

var data_member_name = obj2.data('memberName');


# 사용방법 3>

<div id="list3" data-id="3" data-options="{'name':'이순신', 'level':'장군'}"> 이순신 장군 </div>


jQuery

var obj3 = $('list3');

var data_id = obj3.data('id');

var data_options_name = obj3.data('options').name;

var data_options_level = obj3.data('options').level;



적극적으로 활용하세요.

저 같은 경우엔 touch start, touch move, touch end 같은 이벤트를 활용할때

a href 링크 대싱 data-url 를 활용해서 사용하고 있습니다.

<a href="">메뉴1</a> -> <a data-url="">메뉴 1</a>


$('a').on('click', function(){

var data_url = $(this).data('url');

window.location = data_url;

});










terminal ADB shell 명령어

기본적인 리눅스 명령어를 사용할 수 있습니다.


<ADB 접속 >

1. android sdk 설치경로/platform-tools/ 로 이동

 C:\Android\sdk\platform-tools>


<ADB SHELL 명령어>

# 디바이스 검색 |===========================

adb devices


# 특정 기기로 연결하기 |=====================

adb -s 시리얼넘버


# 설치된 어플 목록 보기 |=====================

pm list packages [-f | -d | -e | -s | -u]


[option]

-f : 설치경로 까지 다 나옴


# 설치된 어플 apk 파일로 추출 하기 |=============

adb pull 어플설치경로 apk백업경로


adb pull /system/app/DownloadProvider.apk  /sdcard/backup/



# apk 어플설치 |=============================

adb install [-r | -s ] apk파일명.apk


[option]

-r :  재설치(데이터 정보 유지)

-s : 메모리카드에 설치


ex) adb install c:\Downloads\HelloWorld.apk

-------------------------------------------


# 어플 삭제 |============================

adb uninstall [-k] 어플설치경로(패키지명)


[option]

-k : 데이터 삭제하지 않음


ex) adb uninstall com.example.hello

----------------------------------------


# 스마트폰 재부팅 |======================

adb reboot


# adb 강제 종료 |========================

adb kill-server


# adb 강제 실행 |========================

adb start-server


# 스마트폰 파일 -> pc로 복사

adb pull /mnt/sdcard/test.hwp c:\MyDocuments


# pc -> 스마트폰으로 파일 복사

adb push c:\MyDocuments\test.pdf /mnt/sdcard/Dowload


# 연결된 스마트폰의 shell에 접속 하기

adb shell



# 기타 명령어 펌


<시스템 기본정보: 하드웨어, 커널>
cat /proc/version : 커널 버전
cat /proc/cpuinfo : 프로세서 정보, CPU타입, 모델 제조사 등
cat /porc/meminfo : 메모리 정보, 실제 메모리 및 가상 메모리
cat /proc/devices : 현재 커널에 설정되어 있는 장치 목록
mount : 마운트된 모든 장치 정보
df : 하드디스크 사용량
cat /porc/filesystems : 커널에 설정되어 있는 파일시스템 목록
cat /proc/swaps : 스왑 파티션의 크기와 사용량
cat /proc/interrupts : 장치가 사용중인 인터럽트(IRQ)목록 표시
cat /proc/ioports : 현재 사용중인 input/output 포트
cat /proc/partitions : 파티션 정보
cat /proc/uptime : 시스템이 얼마나 살아있었는지
cat /proc/stat : 시스템 상태에 관한 다양한 정보, CPU 사용 통계, 부팅이후 page fault 발생 횟수 등
cat /proc/zoneinfo : ZONEINFO
dmesg : 시스템 부팅시 나왔던 메시지
ps : 실행중인 프로세스 정보
ps -p - t : 프로세스와 쓰레드 목록
set or printenv : 환경설정값 출력


<시스템 리소스 사용 현황>
vmstat : 시스템 리소스 상황 모니터, CPU, I/O, Memory 등
cat /proc/diskstats : 디스크 utilization과 throughput. 즉 디스크 I/O현황
top : 시스템 프로세스 상황 모니터링/ 프로세스별 CPU사용량, 메모리와 스왑 사용량 등
procrank : 프로세스별 메모리
dumpsys meminfo [PID] : 해당 프로세스 메모리 상세 정보
cat /proc/[PID]/stat : 해당 프로세스에 대한 정보, 시작시간, 상태, CPU 사용량 등
cat /proc/[PID]/maps : 해당 프로세스의 메모리 맵 정보
cat /proc/vmstat : 버추얼 메모리 통계?
librank : 라이브러리별 메모리 사용량?


<네트워크 관련>
cat /proc/net/netlink : 네트워크 정보
netcfg : 네트워크 인터페이스와 IP주소 목록
netstat : 네트워크 연결상태 확인
nc : 네트워크용 cat 명령어(netcat)
ifconfig : 네트워크 인터페이스 설정 정보. 장치명을 파라미터로 받음. ip 주소. 서브넷마스크 등
tcpdump : 실시간 패킷 모니터링
iftop : 네트워크를 위한 top
route : 해당 호스트까지 연결하는 중간 경로 정보인 라우팅 테이블 표시
ping : 원격 호스트와의 연결 테스트
cat /proc/net/route : Route


<안드로이드 제공>
logcat : 로그캣 보기
pm : package manager의 약자. 패키지/permission/instrumentation/feature 목록, 패키지 설치/제거 등
am : activity manager의 약자, 액티비티 시작, Intent 브로드캐스팅, Instrumentation 시작, profiling 시작 / 중지 등
service : 안드로이드 서비스 목록 표시, 서비스에 명령 전달
monkey : 애플리케이션에 랜덤 이벤트 발생시킴. 사용자 이벤트, 시스템 이벤트의 무작위 발행
cat /data/anr/traces.txt : VM TRACES (쓰레드 덤프)
cat /proc/binder/proc/[PID] : 바인더 프로세스 상태
cat /proc/binder/xxx : 바인더 관련 정보(xxx은 transaction, transaction_log, failed_transaction_log, stats 등)
cat /data/system/packages.xml : 설치된 패키지 세팅 정보
setprop : system property 셋팅
getprop : 셋팅된 system property 목록 출력


<종합 리포트>
dumpsys [service] : app/service 상태정보 덤프, 서비스별로 추가 파라미터 받을 수 있음
dumpstate : device 상태정보 덤프. 상태정보를 추출하는 여러 명령어들의 조합으로 구성
dumpcrash : 애플리케이션이 crach될 때의 상태정보 덤프
bugreport : logcat + dumpsys + dumpstat









checkbox 전체 선택 및 해제 또는 클릭이벤트에 따른 해제(undersocrjs)

js API/jquery 2015. 8. 7. 14:26

체크박스 사용 예제

1. 전체 선택/해제

2. 개별 선택/해제 



※ 배열 관련 자바스크립트는 underscorejs 를 사용(_.isArray, _.compact) 합니다.



# HTML /==============================

# -----------------------------------

<div> 

<input type="checkbox" id="chkall">전체선택

</div>

<ul id="user_list">

<li><input type="checkbox" name="chkid" value="4"><a>A</a></li>

<li><input type="checkbox" name="chkid" value="8"><a>B</a></li>

<li><input type="checkbox" name="chkid" value="5"><a>C</a></li>

<li><input type="checkbox" name="chkid" value="2"><a>D</a></li>

</ul>


# JAVASCRIPT /==========================


1. 전체 선택 / 해제

#--------------------------

var share_people = new Array(); 


function find_index(user_id){

var _index = -1;

var is_share_people = (_.isArray(share_people) && share_people.length>0) ? true : false;

if( !is_share_people){

return _index;

}


for(var i=0; i<share_people.length; i++){

var chkid=share_people[i];

if(chkid == user_id){

_index = i;

break;

}

}

return _index;

}


$('#chkall').on('click',function()

{

if( $(this).is(':checked') ){ //전체선택

$('input[name="chkid"]').each(function() {

var chkbox_val = $(this).val();


if(find_index(chkbox_val) == -1){

share_people.push(chkbox_val);

}

});

$("input[name=chkid]:checkbox").prop("checked", true);

}else{ // 전체해제

$("input[name=chkid]:checkbox").prop("checked", false);

share_people = new Array();

}

});


2. 개별 선택 및 해제

# -------------------------

$('input[name=chkid]:checkbox').on('click',function()

{

var chkbox_val = $(this).val();

var sp_index find_index(chkbox_val) ;


if( $(this).is(':checked') ){

if(sp_index == -1){share_people.push(chkbox_val); }

}else{

if(sp_index != -1){share_people[sp_index]=false; }

share_people = _.compact(share_people);

}

});

Model, View PHP를 통해 json 데이터 가져와 model에 담고 view로 출력한다.

js API/backbonejs 2015. 6. 19. 13:49

# Model 만들기

==========================================

Taa = Backbone.Model.extend({

    urlRoot : '/list.php', // ajax를 통해서 json데이터를 가져올 php경로

    initialize: function(options){

        this.todate = options.todate;

        console.log(this.todate);

    },

    fetchParams: function(){

// model data에 값 등록

        this.fetch({ data: $.param({ todate: this.todate }) });


// urlRoot에 추가  query string 추가

        this.urlRoot+="?"+$.param({ todate: this.todate });  

    },

    url: function()

    {

        console.log(this.urlRoot);

        return this.urlRoot;

    }

});


# View

==========================================

TaaView = Backbone.View.extend({

    initialize: function(){

        _.bindAll(this, "render");

        this.model.fetch({

            success: this.render

        });

    },

    render: function(){

/*

{

"result":"true", 

"msg":[

{

position_day:20, 

list:[

{title:"제목"}

]

},


{

position_day:23, 

list:[

{title:"제목"}

]

}

]

}

*/

        console.log(JSON.stringify(this.model));


// 배열을 돌리면서 원하는 곳에 하기

        _.each(this.model.get('msg'), function(data){

            var dday_id = 'd'+data.position_day;

            var lists = data.list;


// unsderscore template 를 사용해 출력(난 jquery를 활용해 이미 불러온 템플릿 리소스 체크

            $('#'+dday_id).append($.template('calendar_data_template', {row : lists}));

        });

    }

});


# model 실행 --------------------------

var taa = new Taa({'todate' : '2015-05-01'});

taa.fetchParams();

        

# view 실행 ---------------------------

new TaaView({ model: taa });

선택(v), 복사(y), 붙이기(p) - 리눅스

vi 2015. 3. 9. 16:20

텍스트 복사 붙이기 순서


(1) v : Visual mode 로 진입 (현재 문서를 편집중이라면 Esc키를 누르고, v키를 눌러야 함)

(2) 그런 후, 상하좌우 화살표키를 움직이면, 이제 선택 블록이 회색으로 잡힙니다. 복사할 부분을 선택합니다.

(3) y : yank (복사; Copy) yank는 '홱 잡아당긴다'는 뜻

(4) 문서를 스크롤하여, 복사된 텍스트를 붙어 넣을 곳으로 이동

(5) p : put (붙여 넣기; Paste)