본문 바로가기

컴퓨터/HTML,CSS,JS,JQUERY

(21)
form에 <input type="text">가 1개 있는 경우 form을 사용할 때 를 1개만 사용하면 엔터키를 쳤을 때 action이 없더라도 그냥 submit되어버린다. (왜일까!) 따라서 1. onsubmit() 이벤트를 걸어서 해결 (return false로 submit 막기) 2. (visibility로 하면 자리를 차지) 의 방법으로 해결하였다.
jQuery-radio button(라디오버튼) 제어 하기 ▶ 체크 여부 확인(checked) $('input:radio[name=라디오버튼이름]').is(':checked'); //ture or false ▶ value 값으로 체크 $('#라디오버튼id:radio[value="값"]').attr("checked",true); $('input[name='라디오버튼이름']').prop("checked",true); //name이 같은 것들은 모두 체크(체크박스 포함) ▶ 체크된 버튼 value 값 가져오기 $('#라디오버튼id:checked').val(); ▶ 체크 해제 $('#라디오버튼id:radio[value="값"]').attr("checked",false); $("input:radio[name='라디오버튼이름']").prop('checked',false);..
jQuery-checkbox(체크박스) 제어 하기 ▶체크박스 체크 여부 확인(checked) $('input:checkbox[id="체크박스아이디"]').is(":checked")==true $('input:checkbox[name="체크박스네임"]').is(":checked")==true $("#체크박스아이디").is(":checked"); // jquery의 아이디 선택자 -'#' (클래스 선택자 -'.') ▶체크박스 전체 개수 $('input:checkbox[name="체크박스네임"]').length //id는 중복 사용이 불가하므로 전체 체크 여부 혹은 길이를 구할 때에는 name을 이용 ▶체크박스 체크된 요소 개수 $('input:checkbox[name="체크박스네임"]:checked').length //위와 같은 이유로 name 사용 ▶체크..
html - 웹 스토리지와 기타 API 웹 스토리지란 웹 브라우저에 자료를 저장하기 위한 기능이다. 웹 스토리지의 종류는 로컬 스토리지와 세션 스토리지 두가지로 나뉜다. 로컬 스토리지는 브라우저 종료와 무관하게 자료를 보관하는 반면, 세션 스토리지는 세션이 종료될 시 저장된 자료가 사라진다. ​ - 장치에 데이터를 저장하기 위해 사용한다. (저장 기간 제한이 없음) - key/value 쌍으로 데이터를 저장한다. - windsow.localStorage 객체와 Storage 이벤트, StorageEvent 객체를 이용한다. ​ - window.localStorage.setItem("키이름", "문자열값") : 데이터 저장 - window.localStorage.getItem["키이름"] : 데이터 읽기 - window.localStorage...
html, js 기능 정리 - 멀티미디어 제어, 위치 정보 사용 자바스크립트 API 를 사용하면 멀티미디어 기능 요소를 제어할 수 있다. ​ - 속성 src : 파일 소스 currentTime : 현재 재생 시간 duration : 재생 길이 volume : 볼륨 ​ - 메소드 play() : 재생 시작 pause() : 일시 정지 ​ - 관련 이벤트 canplay : 재생 가능 시 timeupdate : 재생 중 주기적으로 play : 재생될 때 ended : 재생 종료시 ​ ​ GPS가 내장된 모바일 기기에서 정확한 위치 파악이 가능하다. (위,경도 조회) navigator.geolocation 이용 (내장 객체) - getCurrentPosition(성공콜백함수, 에러콜백함수, 옵션) : 단발성 위치 요청으로 현재의 위치 정보를 반환한다. 위치 정보 요청 성공 ..
html 캔버스 기능 정리하기 - 태그로 요소 추가 ex) ​ - 캔버스에 내용을 채우기 위한 객체 (그림 그리기) - getContext("2d") 메소드 stroke() : 선을 그리는 메소드 (초기값은 검정색) moveTo(x,y) : 선의 시작 지점의 좌표를 (x,y)로 이동 lineTo(x,y) : 시작지점에서 (x,y)까지 선을 그림 ​ rect(x,y,width,height) : (x,y)지점을 왼쪽 위 모서리, width,height 길이의 사각형을 그린다. arc(x,y,r,startAngle, endAngle, antiClockwise) : (x,y)시작점으로 하고 r을 반지름으로 하는 원을 그림 , 시작 각도와 끝 각도를 지정할 수 있으며, antiClockwise 값을 설정하면 반시계방향으로 원호가 그려진다. ​..
javascript 이벤트 정리 '이벤트'란 웹 브라우저 사용 중 발생하는 키보드, 마우스 등의 입력으로 이벤트가 발생될 때 작성된 자바스크립트 코드를 실행시키는 것을 '이벤트 처리'라고 한다. ​ ​ *태그 속성은 이벤트 이름 앞에 on을 붙이면 된다. ​ click : html 문서의 요소를 클릭 시 발생 dblclick : html 문서의 요소를 더블 클릭 시 발생 mousedown : 마우스 커서를 html 문서 내의 요소에 위치시키고 마우스 버튼을 누를 시 발생 mousemove : 마우스 커서를 html 문서 내의 요소 위에서 이동시킬 시 발생 mouseup : 마우스 커서를 html 문서 내의 요소 위에 위치시키고 버튼을 땔 시 발생 mouseover : 마우스 커서가 해당 요소 위에 위치할 경우 발생 (연속x) mouse..
[내가 보려고 만든] javascript 문법 정리 기본적인 javascript 문법에 대한 정리이다. ​ - document.write() : html 문서에 콘텐츠를 추가하는 명령어로 화면 출력 명령어이다. html 태그를 추가할 시 태그가 해석되어 출력된다. ​ - 대부분의 자바스크립트 변수는 사용 전에 선언할 필요가 없고, 타입 또한 지정할 필요가 없다. 기본 변수 타입은 다음과 같다. ​ Number, String, Boolean, Undefined, Null ​ *Number는 모든 숫자를 실수로 저장한다. *숫자와 문자열 타입 간의 비교 시에는 숫자에서 문자열로 자동 형변환을 제공한다. *typeof()연산자로 변수 타입 확인이 가능하다. ​ ​ - 변수 이름은 대소문자를 구분한다. ​ ex) var 변수명; var 변수명 = 변수값; - 전..

728x90