如何实现两个input文本框值同步交换？现有代码仅第一个输入框正常

嘿，我来帮你搞定这个输入框值交换的问题！听起来你现在的代码里第一个输入框能正常工作，但第二个出问题，大概率是交换逻辑里没正确暂存值，或者获取第二个输入框元素的时候出了小差错。

核心思路：必须先暂存其中一个值 #

交换两个输入框的值时，一定要先把其中一个值存在临时变量里——如果直接互相赋值，先被覆盖的那个值会彻底丢失，自然没法完成完整交换。

完整可运行代码示例 #

HTML部分

<input type="text" id="input1" placeholder="输入第一个值">
<input type="text" id="input2" placeholder="输入第二个值">
<button onclick="swapValues()">交换值</button>

JavaScript部分

function swapValues() {
  // 获取两个输入框的DOM元素
  const input1 = document.getElementById('input1');
  const input2 = document.getElementById('input2');
  
  // 暂存第一个输入框的值，避免被后续赋值覆盖
  const tempValue = input1.value;
  
  // 执行交换操作
  input1.value = input2.value;
  input2.value = tempValue;
}

关键细节提醒 #

• 务必保证输入框的id属性和JS里getElementById的参数完全一致，这是新手最容易踩的小坑
• 临时变量tempValue是交换逻辑的核心，没有它就会出现“覆盖后丢失原值”的问题
• 这个逻辑兼容空值场景，哪怕其中一个输入框没填内容，也能正常完成交换

把这段代码替换你现有的实现，点击按钮就能看到两个输入框的值同步交换啦！

内容的提问来源于stack exchange，提问作者Mohamed Hassan