本节要实现的是，当我们在一个文本框中输入内容时，在另一个文本框中同步显示我们输入的内容。
该案例主要是对内容被改变事件oninput的回顾，大家可以通过本案例举一反三，希望可以更深入的理解事件。
大家可以先尝试做一下，实在做不出来再看下面的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>在页面中动态输出文本框的内容</title>
</head>
<body class="" id="body">
请输入：<input type="text" id="input1"><br>
输入了：<input type="text" id="input2">
<script type="text/javascript">
//第一个input输入了内容， 第二个跟着变。内容改变的事件 oninput
//知识点：oninput事件 / value属性
//获取第一个input
var input1 = document.getElementById('input1');
//绑定oninput事件
input1.oninput = function(){
//事件处理函数中，
//获取第一个input的内容（value属性值）
var str = input1.value;
// var str = this.value;
// console.log(str);
//获取第二个input
var input2 = document.getElementById('input2');
//修改第二个input的内容（value属性值）
input2.value = str;
}
</script>
</body>
</html>
|
窥视卡
雷达卡
发表于 2023-1-26 22:21:03
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡
发表于 2023-2-20 09:40:05
