效果
核心代码
<script>
//获取输入框 和 提示框
var con = document.querySelector('.con');
var input = document.querySelector('.jd');
//添加事件
input.addEventListener('keyup', function () { //当按键抬起时
//如果输入框内容不为空,则显示提示框
if (this.value != '') {
con.style.display = 'block';
//将this 当前输入的值赋给提示框
con.innerText = this.value;
}
//如果输入框内容为空,则不显示提示框
else {
con.style.display = 'none';
}
})
//失去焦点时,不显示con盒子
input.addEventListener('blur', function () {
con.style.display = 'none';
})
//获得焦点时,显