在表单输入域或div区域中定义各类事件(如通过单击按钮触发事件;获得或失去焦点事件)的编程代码
时间: 2024-03-18 19:42:30 浏览: 16
以下是一些在表单输入域或div区域中定义各类事件的编程代码:
1. 通过单击按钮触发事件:
```
<button onclick="myFunction()">Click me</button>
<script>
function myFunction() {
alert("Hello World!");
}
</script>
```
2. 获得或失去焦点事件:
```
<input type="text" onfocus="myFunction()" onblur="myBlurFunction()">
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Input field has focus.";
}
function myBlurFunction() {
document.getElementById("demo").innerHTML = "Input field lost focus.";
}
</script>
```
3. 按下键盘事件:
```
<input type="text" onkeyup="myFunction()">
<script>
function myFunction() {
var x = document.getElementById("fname");
x.value = x.value.toUpperCase();
}
</script>
```
4. 鼠标进入或离开事件:
```
<div onmouseenter="myFunction()" onmouseleave="myLeaveFunction()">Mouse over me</div>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Mouse entered the div.";
}
function myLeaveFunction() {
document.getElementById("demo").innerHTML = "Mouse left the div.";
}
</script>
```
5. 滚动事件:
```
<div onscroll="myFunction()">Scroll me</div>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "You scrolled the div.";
}
</script>
```
这些代码只是一些基本的示例,实际上,还有很多其他的事件可以在表单输入域或div区域中定义。