글
DOM Event
JS HTML PHP
2011. 12. 13. 16:31
1 /* 공통 CSS */ 2 body{ 3 margin: 0; 4 padding: 0; 5 font-size: 16px; 6 font-family: "굴림", "Times New Roman"; 7 } 8 h1{ 9 margin-top: 10px; 10 margin-left: 40px; 11 font-size: 18px; 12 } 13 #groupOne { 14 margin-top: 20px; 15 margin-left: 40px; 16 } 17 .idcolor { 18 background-color: yellow; 19 }
1 //----------------------------------------------------- 2 // 이벤트 개요 3 //----------------------------------------------------- 4 window.onload = function () { 5 var qtyClick = document.getElementById('qty'); 6 var priceClick = document.getElementById('price'); 7 8 if (qtyClick.addEventListener) { 9 qtyClick.addEventListener('keyup', Show.qty, false); 10 priceClick.addEventListener('keyup', Show.price, false); 11 } else { 12 qtyClick.attachEvent('onkeyup', Show.qty); 13 priceClick.attachEvent('onkeyup', Show.price); 14 } 15 } 16 var Show = { 17 entryQty: 0, 18 entryPrice: 0, 19 qty: function(event) { 20 var clickElement = event.target || event.srcElement; 21 $('show1').innerHTML = Show.entryQty = clickElement.value; 22 Show.amount(); 23 }, 24 price: function(event) { 25 var clickElement = event.target || event.srcElement; 26 $('show2').innerHTML = Show.entryPrice = clickElement.value; 27 Show.amount(); 28 }, 29 amount: function() { 30 $('show3').innerHTML = '금액: ' + Show.entryQty * Show.entryPrice; 31 } 32 }
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>이벤트</title> 6 <link rel="stylesheet" href="../commCSS.css" type="text/css" /> 7 <script language="javascript" type="text/javascript" src="../prototype_160.js"></script> 8 <script language="javascript" type="text/javascript" src="event.js"></script> 9 </head> 10 <body> 11 <h1>이벤트 발생</h1> 12 <div id="groupOne"> 13 수량: <input type="text" id="qty" /> 14 단가: <input type="text" id="price" /> 15 16 <br /><br /> 17 <div id="showArea"> 18 <div id="show1"></div><br /> 19 <div id="show2"></div><br /> 20 <div id="show3"></div> 21 </div> 22 </div> 23 </body> 24 </html>
'JS HTML PHP' 카테고리의 다른 글
| ADODB와 쿼리 캐시를 사용 하는 방법? (0) | 2011.12.17 |
|---|---|
| Web Standard Class (0) | 2011.12.15 |
| DOM 기초 (0) | 2011.12.12 |
| 웹 폰트 web font (0) | 2011.11.21 |
| 이벤트 리스너같이 사용하는 PHP클래스 (0) | 2011.11.13 |
