밑에 자바 스크립트로 테이블 클릭할때마다 색깔 바뀌는것 구현해 달라고 하신분께 드립니다. 정보
밑에 자바 스크립트로 테이블 클릭할때마다 색깔 바뀌는것 구현해 달라고 하신분께 드립니다.본문
자바스크립트도 객체 지향 언어니까 C 처럼 간단히 함수와 변수로 뭐든지 구현할 수 있습니다. 간단히 아래의 코드를 짜 보았는데요 주석 참조하시며 적용해보세요
이상하게 여기서 에러 뜨길래 완성본 화일로 첨부 했습니다. 확인해보세요.
<script language="javascript">
<!--
// 색깔에 관한 정보를 관리할 변수들의 배열입니다. 원하는 항목 갯수만큼 만들고 초기화 시키세요
Flag = new Array(2);
Flag[0] = 0;
Flag[1] = 0;
<!--
// 색깔에 관한 정보를 관리할 변수들의 배열입니다. 원하는 항목 갯수만큼 만들고 초기화 시키세요
Flag = new Array(2);
Flag[0] = 0;
Flag[1] = 0;
// 실제 색깔 바꾸기에 쓰일 함수입니다. 이 함수는 색깔을 두개 선택할 수 있습니다.
// Color1,2,3... 이렇게 변수를 추가하시고 새로 함수를 만드시면
// 3개 4개... 더 많은 색깔을 사용할 수도 있지요.
// 색깔이 세개 이상일때는 스위치 문이 효율적입니다. 2개때는 아래의 코드를 그냥 쓰세요.
function ChangeColor(Table, Index, Color1, Color2)
{
if(Flag[Index]){
Table.style.backgroundColor=Color1;
Flag[Index] = 0;
}
else{
Table.style.backgroundColor=Color2;
Flag[Index] = 1;
}
}
//-->
// Color1,2,3... 이렇게 변수를 추가하시고 새로 함수를 만드시면
// 3개 4개... 더 많은 색깔을 사용할 수도 있지요.
// 색깔이 세개 이상일때는 스위치 문이 효율적입니다. 2개때는 아래의 코드를 그냥 쓰세요.
function ChangeColor(Table, Index, Color1, Color2)
{
if(Flag[Index]){
Table.style.backgroundColor=Color1;
Flag[Index] = 0;
}
else{
Table.style.backgroundColor=Color2;
Flag[Index] = 1;
}
}
//-->
</SCRIPT>
<!--
onClick : 마우스 클릭시
onMouseOver : 마우스 진입시
onMouseOut : 마우스 이탈시
이 외에도 키보드 다운, 마우스 더블클릭 등 다양한 형태의 이벤트 핸들러가 있습니다.
드림위버의 인텔리센스 기능(스페이스 키를 누르면 테그 리스트가 뜹니다)을 이용해서
자신에게 필요한 이벤트 핸들러를 사용하세요
함수 호출 방법은 다음과 같습니다.
ChangeColor(this, 플래그인덱스, '색깔1', '색깔2')
this 는 현재 내가 처리할 대상의 포인터, 즉 여기서는 셀의 포인터구요(포인터 = 주소)
플래그인덱스는 위에서 선언한 배열. 셀 마다 다른 인덱스를 사용하세요.
색깔1, 색깔2는 번갈아 가며 나타낼 색깔 이름 입니다.
//-->
<TABLE border=1>
<TR>
<TD style="BACKGROUND-COLOR: red" onclick="ChangeColor(this, 0, 'RED', 'BLUE')">최불암</TD>
<TD style="BACKGROUND-COLOR: orange" onclick="ChangeColor(this, 1, 'ORANGE', 'PURPLE')">이문세</TD></TR>
onClick : 마우스 클릭시
onMouseOver : 마우스 진입시
onMouseOut : 마우스 이탈시
이 외에도 키보드 다운, 마우스 더블클릭 등 다양한 형태의 이벤트 핸들러가 있습니다.
드림위버의 인텔리센스 기능(스페이스 키를 누르면 테그 리스트가 뜹니다)을 이용해서
자신에게 필요한 이벤트 핸들러를 사용하세요
함수 호출 방법은 다음과 같습니다.
ChangeColor(this, 플래그인덱스, '색깔1', '색깔2')
this 는 현재 내가 처리할 대상의 포인터, 즉 여기서는 셀의 포인터구요(포인터 = 주소)
플래그인덱스는 위에서 선언한 배열. 셀 마다 다른 인덱스를 사용하세요.
색깔1, 색깔2는 번갈아 가며 나타낼 색깔 이름 입니다.
//-->
<TABLE border=1>
<TR>
<TD style="BACKGROUND-COLOR: red" onclick="ChangeColor(this, 0, 'RED', 'BLUE')">최불암</TD>
<TD style="BACKGROUND-COLOR: orange" onclick="ChangeColor(this, 1, 'ORANGE', 'PURPLE')">이문세</TD></TR>
</TABLE>
추천
0
0
첨부파일
댓글 9개
오~~ 이것은 작년에 자바스크립트 책으로 공부할 땐 알았었는데...
몇개월지나고 나니 까먹었어요... ㅠ_ㅠ
몇개월지나고 나니 까먹었어요... ㅠ_ㅠ
Error뜨네여 ㅋㅋ
이미지 어따 올리지? 이미지 Capture 했는데 ㅋㅋ
내 Hard에 있는 이미지 화일은 으찌? 링크 시켜여? ㅋㅋ
아니면? 어따 올리는거 있나여? 첨부? ㅎㅎ 댓글에도 첨부 되게 해 주세여~! 눼~~~~~
리자 엉아~~~~~~~~~~~~ 아잉~!~~~~~~!
이미지 어따 올리지? 이미지 Capture 했는데 ㅋㅋ
내 Hard에 있는 이미지 화일은 으찌? 링크 시켜여? ㅋㅋ
아니면? 어따 올리는거 있나여? 첨부? ㅎㅎ 댓글에도 첨부 되게 해 주세여~! 눼~~~~~
리자 엉아~~~~~~~~~~~~ 아잉~!~~~~~~!
틀리셨습니다.
리자 언냐 혹은 리자 누나입니다.
리자 언냐 혹은 리자 누나입니다.
리자~! 언냥? 누나?
요자에여? ㅋㅋㅋ 그걸 우찌 아셨나? ㅋㅋ
아어~! 궁금해라 ㅋㅋ
나도 리자님~! 보고파~~~~~~~~~~ ^^*
요자에여? ㅋㅋㅋ 그걸 우찌 아셨나? ㅋㅋ
아어~! 궁금해라 ㅋㅋ
나도 리자님~! 보고파~~~~~~~~~~ ^^*
악성 루머의 유포는,
관련법 OO O조에 의거
쪼~~~오기로 유배될 수도 있습니다.
관련법 OO O조에 의거
쪼~~~오기로 유배될 수도 있습니다.
게시판에서는 에러뜨네요. 전역변수랑 함수가 있어서 그런듯 합니다.
그래서 완성본 화일 첨부했으니 그걸로 미리보기하셔요.
그래서 완성본 화일 첨부했으니 그걸로 미리보기하셔요.
맞아여~! ㅋㅋ
html 화일로 된거 다운 받아서 하니까~! 잘되여 ㅋㅋ
넘 좋다 ㅋㅋ ㄱ ㅓ 생 하셨습니다~! (__)끄빢~! 좋은 Source 잘 쓸게여 ㅋㅋ
html 화일로 된거 다운 받아서 하니까~! 잘되여 ㅋㅋ
넘 좋다 ㅋㅋ ㄱ ㅓ 생 하셨습니다~! (__)끄빢~! 좋은 Source 잘 쓸게여 ㅋㅋ
^^
한방 쏩니다. 두방 쏘지 못하는게 안타깝네요.
한방 쏩니다. 두방 쏘지 못하는게 안타깝네요.
고맙습니다. 저을 위해서 올려주신 글입니다...^^
그런데요, 한가지 더 추가 가능할까요?
색깔이 유지되는건 딱 제가 원하는거구요,
f5를 누르거나 리프레쉬하면 색깔이 다 사라지더구요.
그래도 색깔이 사라지지 않게도 할수 있을까요?
http://www.sir.co.kr/bbs/tb.php/cm_free/88669
그런데요, 한가지 더 추가 가능할까요?
색깔이 유지되는건 딱 제가 원하는거구요,
f5를 누르거나 리프레쉬하면 색깔이 다 사라지더구요.
그래도 색깔이 사라지지 않게도 할수 있을까요?
http://www.sir.co.kr/bbs/tb.php/cm_free/88669