有一个input输入框和一个div，当我们在input输入英文字符时，div中显示的,文字随时保持和input中输入的值相同

最新推荐文章于 2023-07-26 15:06:09 发布

Da6668_lei

最新推荐文章于 2023-07-26 15:06:09 发布

阅读量905

点赞数

文章标签： javascript html

本文链接：https://blog.csdn.net/Da6668_lei/article/details/105599594

版权

有一个input输入框和一个div，当我们在input输入英文字符时,在点击button按钮时，div中显示的文字随时保持和input中输入的值相同

	<style type="text/css">
		input {
			width: 150px;
			height: 24px;
		}
		div {
			border: 1px solid #000;
			width: 220px;
			height: 200px;
		}
		button {
			width: 60px;
			height: 30px;
			margin: 16px;
		}
	</style>
	<script type="text/javascript">
		function move(){//点击事件
		let btnput = document.getElementById("btnput");//获取input的id值
		let btndiv = document.getElementById('btndiv');//获取div的id值
		let  btnbutt = document.getElementById('btnbutt');//获取button的id值
		btnbutt.onclick = function(){
		//将input中value的值用s保存起来
				let s = btnput.value;
			btndiv.innerText = s;//将s的input输入框内容打印到div里面
			console.log(btndiv.innerHTML);
			}
		}
	</script>
</head>
<body>
	输入框：<input type="" name="" id="btnput" placeholder="请输入想要输入的值" value="" /><br>
	按钮：<button id="btnbutt" type="button" value="" onclick="move()">确定</button>
	<div id="btndiv"></div>
</body>

Da6668_lei

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
有一个input输入框和一个div，当我们在input输入英文字符时，div中显示的,文字随时保持和input中输入的值相同

有一个input输入框和一个div，当我们在input输入英文字符时，div中显示的,文字随时保持和input中输入的值相同 <style type="text/css"> input { width: 150px; height: 24px; } div { border: 1px solid #000; width: 220px; hei...
复制链接

扫一扫