728x90
728x90

onchange : Html의 요소가 바뀌었을 때 (텍스트입력칸 변경 등)

 

<select onchange="myFunction()">
<input type="text" name="txt" value="Hello" onchange="myFunction(this.value)">

 

onclick : 유저가 Html의 요소를 클릭했을 때

 

onmouseover : 유저가 마우스를 html 요소로 올렸을 때

 

onmouseout : 유저가 마우스를 html 요소 밖으로 옮겼을 때

 

onkeydown : 유저가 키보드 키를 눌렀을 때

 

<input type="text" onkeydown="myFunction()">
<element onkeydown="myScript">
object.onkeydown = function(){myScript};
object.addEventListener("keydown", myScript);

 

onload : 브라우저가 페이지의 로딩을 완료했을 때

 

 

 

JavaScript Events

JavaScript Events HTML events are "things" that happen to HTML elements. When JavaScript is used in HTML pages, JavaScript can "react" on these events. HTML Events An HTML event can be something the browser does, or something a user does. Here are some exa

www.w3schools.com

 

 

 

onkeyup : 값을 입력할 때마다 이벤트를 발생

  • onkeyup , onmouseup = javascript용
  • keyup , mouseup = jqeury용

 

<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script src="http://code.jquery.com/jquery-3.1.0.min.js"></script>
<script>
 
function calc(val){
    var origin = parseInt(val);
    var interest = (20/100)*origin;
    
    if(val == ""){
        document.getElementById('result').value = "0";
    }else{
        document.getElementById('result').value = interest;
    }
}
 
</script>
</head>
<body>
    <div>원금 : <input type="text" id="origin" onkeyup="calc(this.value)"/></div>
    <div>이자 :  <input type="text" id="result" disabled/></div>
</body>
</html> 

 

728x90
728x90
블로그 이미지

coding-restaurant

코딩 맛집에 방문해주셔서 감사합니다.

,

v