实现两个INPUT同步输入

最新推荐文章于 2022-11-11 17:54:33 发布

piperzero

最新推荐文章于 2022-11-11 17:54:33 发布

阅读量2k

点赞数

分类专栏：网站建设文章标签： input javascript function

网站建设专栏收录该内容

740 篇文章

订阅专栏

本文介绍了几种使用JavaScript实现在HTML中不同元素间同步文本框值的方法。包括通过name属性、ID选择器及实时同步输入等不同场景下的实现方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

不同name时
<script>
function jj(){
var a=document.getElementsByName("s1")[0].value;
document.getElementsByName("s2")[0].value=a;
}
</script>
<input name=s1 type="text" value="corange.cn">
<input name=s2 type="text" value=""onfocus="jj()">
请把鼠标移动到第二个文本框
===================
不同IP时候
<script>
function jj(){
var a=document.getElementById("s1").value;
document.getElementById("s2").value=a;
}
</script>
<input id=s1 type="text" value="蓝色理想">
<input id=s2 type="text" value=""onfocus="jj()">
请把鼠标焦点放到第二个文本框
====================
实时同步输入
<script language="javascript">
function copyob1toob2(){
document.all["ob_text_2"].value=document.all["ob_text_1"].value
}
</script>
<input type="text" id="ob_text_1" size=20 onkeyup="copyob1toob2()">
<input type="text" id="ob_text_2" size=20>
=====================
或者<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
</head>
<body>
<input id="s1" type="text" value="">
<input id="s2" type="text" value="" >
<script>
var o_1 = document.getElementById("s1");
var o_2 = document.getElementById("s2");
o_1.onkeyup = function(){
//onkeyup,如果用onkeydown则少一个字母
o_2.value = o_1.value
}
</script>
</body>
</html>