어제 키보드 키의 가치를 얻는 이벤트를 녹음했습니다. 값을 사용하면 다른 값에 대해 다른 작업을 수행하는 것 이상입니다. 나는 욕심 많은 뱀에 대해 글을 쓸 때 전에 그것을 사용했습니다. 결과적으로 기록하는 데 오랜 시간이 걸렸으므로 기록해야한다고 생각했습니다. 한편으로, 실제로 좋은 것이 있었고, 다른 한편으로는, 나는 방금 깨달은 기능이 다시 낯선 사람이라는 것을 상기시켰다. 일반적으로, 그것은 과거에 대한 검토로 간주되어 새로운 것을 배우는 것으로 간주되었습니다.
먼저 키보드 작업을 구현하는 일반적인 원칙을 분석하여 DIV 움직임을 실현하겠습니다.
*--- DIV의 움직임을 실현하기 위해 가장 중요한 점은 DIV 개체를 얻는 것입니다.
*--- 포지션 : Absolute는 문서 스트림에서 DIV를 완전히 끌어냅니다. 이 장소는 놓쳤다. 나는 탐욕스러운 뱀을 보러 돌아간 후에 만 발견했습니다. 너무 어지러워.
*--- 키보드를 얻는 작업
*--- 다른 키보드 작업에 따라 다른 응답을 제공합니다
이것이 제가 생각할 필요가있는 것입니다. 먼저 코드를 살펴 보겠습니다.
먼저, HTML 부분
<div id = "showzone">
그런 다음 JavaScript의 실제 작동을 기록하십시오
wind var toleft = toright = totop = tobottom = false; // 후속 방향 조작을 위해 여러 부울 변수를 정의하고, 그것은 4 방향으로 보인다. var move = setInterval (function () {//이 장소의 움직임 정의는 실제로이 방법을 더 명확하게 만들기 위해 (obj.style.left = parseft =+). parseint는 PX를 포함하지 않기 때문에 "px"} if (toright) {obj.offsetleft +a +"px"; obj.style.top = obj.offsetop-a+"px"; //이 클래식 타이머는 루프 실행을위한 훌륭한 도구입니다. SetInterval과 settimeout document.onkeydown = function (event) {var event = event || window.event; switch (event.keyCode) {// 하하, 키보드 작동 케이스를 가져옵니다. 사례 39 : toright = true; break; 사례 40 : Tobottom = true; break; }}; document.onkeyup = function (event) {switch (event.keyCode) {case 37 : toleft = false; break; // 다시 변경하고 멈추고 이동하지 말라고 말하십시오. 사례 39 : Toright = false; break; 사례 40 : Tobottom = false; break; }}; };이러한 방식으로 원칙 분석에서 요구 사항을 완료했으며 동시에 DIV를 위, 아래, 왼쪽 및 오른쪽 버튼을 위, 아래, 왼쪽 및 오른쪽 버튼을 통해 이동할 수 있습니다. 다음으로 민감한 장소를 기록해 봅시다.
1. DIV는 절대적이어야합니다. 이것으로 오랫동안 어려움을 겪은 후에는 그만한 가치가 없습니다. 그래서 나는 "문서 흐름"개념에 대해 확인하고 배웠습니다.
문서 흐름은 일반적으로 위에서 아래로, 왼쪽에서 오른쪽으로 배열된다고합니다.이 요소는 노드 요소, 거대한 dom입니다. 먼저 다른 설명에 대해 이야기합시다. 내가 선호하는 것은 이것을 설명하는 것입니다 : Document + Stream. 이름에서 알 수 있듯이 문서는 웹 페이지 문서를 의미하며 스트림은 출력 메소드입니다. 일부 설명은 브라우저 분석 방법입니다. 이것은 더 생생한 것 같습니다. 일반적인 문서 흐름은 평면과 같으며 요소를 넣을 때마다 어디에 있든 그것이있는 곳입니다. 플로팅, 고정 위치 및 상대 위치. 여기서 절대 분석은 z- 인덱스와 마찬가지로 부모 층 레이블에서 분리 된 스트림을 재생하는 것입니다. z-index가 0과 Z-Index가 그 위에, 플로팅 및 상단에 있었고 왼쪽과 상단을 통해 무작위로 이동할 수 있습니다.
나는 일반적인 의미를 이해할 수 있지만 일부 부분은 언어로 효과적으로 표현 될 수 없으며 일부 요점은 약간 흐릿하다고 생각합니다. 나는 경험이 축적됨에 따라 그것들을 더 깊이 이해할 수 있다고 생각합니다.
2. 키 코드의 대문자, onkeyup 및 onkeydown의 소문자 도이 장소를 테스트 한 후 발견 된 문제입니다. JavaScript의 경우 모든 작은 장소는 큰 문제입니다.
3. 스위치를 중단하십시오. 나는 종종이 자바를 만나기 때문에 많이 말하지 않을 것입니다
일반적인 문제는 위의 요점입니다. 댓글이 달린 단축키 키 및 기타 바로 가기 키를 여전히 기억하십니까? 이것은 문제가 있습니다. 우리는 그것에 단일 키를 대상으로 한 것에 대해 응답했습니다. 바로 가기 키를 사용하려면 어떻게 설정해야합니까?
코드를 살펴 보겠습니다.
document.onkeydown = function (event) {// 여전히 위와 같은 코드입니다. 차이가 보이나요? var event = event || window.event; var bctrl = event.ctrlkey; // 여기 스위치 (event.keycode) {case 37 : toleft = true; break; 사례 38 : if (bctrl) {obj.style.backgar 사례 40 : Tobottom = true; break; }};여기서 나는 이벤트 객체의 다른 속성을 발견했는데,이 객체는 외부의 키 코드, ctrlkey 또는 대문자입니다. 주요 기능은 CTRL 키의 상태를 확인하는 것입니다. 실제로, 다른 두 가지가 있습니다.
Altkey와 ShiftKey는 각각 ALT 키 및 시프트 키의 상태에 대한 검사입니다. 이런 식으로 바로 가기 키를 설정하는 방법을 알고 있습니다.
사실, 내가 직접 썼다면, 나는 만족할 수 있지만, 읽고 검색 할 때 나는 항상 사려 깊은 친구들을 만난다.
코드를 첨부하십시오. 무엇을 해야하는지 알고 있습니까?
함수 Limit () {var doc = [document.documentElement.clientWidth, document.documentElement.clientHeight] // obj.offsetleft <= 0 && (<font-family : arial, helvetica, sans-serif; "> obj </spy> <font-family : arial, helvetica, sans-serif; ">. style.left = 0); </span> // obj.offsettop 방지 <= 0 && (obj.style.top = 0); // 오른쪽에서 doc [0]을 방지 -Obj.offsetLeft -obj.offsetWidth <= 0 && (obj.style.left = doc [0] -sbj.offsetWidth + "px"); // 하단 오버플로 DOC 방지 DOC [1] - OBJ.OffSetTop -obj.offsetheight <= 0 && (obj.style.top = doc [1] - obj.offsetheight + "px")}여기에 첨부 한 것은 인터넷의 코드가 오버플로를 방지하도록 설계되었지만이 글쓰기 방법을 칭찬하고 싶다는 것입니다. 내가 단호하게 쓰는 것보다 훨씬 짧습니다. 앞으로 더 짧게 쓰려고 노력할 것입니다.