如何用SPAN值覆盖Input输入框并写入GrandTotal输入框？

我帮你调整了代码，完美实现你需要的两个功能：把SPAN的内容写回输入框，同时将SPAN的最终结果同步到只读的GrandTotal输入框。以下是修改后的完整代码和说明：

完整HTML代码 #

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<input type="text" id="txtx1" /><br /> 
<span id="txtSpan"></span> 
<input type="button" value="Appended-textBox" id="Btn3" />

<div> 
  <label class="description" for="Coconut">Coconut</label> 
  <input id="Coconut" name="Coconut" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/> 
</div> 
<div> 
  <label class="description" for="GrandTotal">Grand Total</label> 
  <input id="GrandTotal" name="GrandTotal" class="element text medium" type="text" maxlength="255" value="" readonly="true"/> 
</div>

修改后的JavaScript代码 #

$(document).ready(function() { 
  $('#Btn3').click(function() { 
    // 原功能：获取输入框值并写入SPAN
    var txtvalue = $('#txtx1').val(); 
    $("#txtSpan").text(txtvalue); 

    // 新增功能1：将SPAN的内容反向覆盖输入框
    $('#txtx1').val($("#txtSpan").text());

    // 新增功能2：将SPAN的结果同步到只读的GrandTotal输入框
    $('#GrandTotal').val($("#txtSpan").text());

    console.log("当前同步的值：", $("#txtSpan").text()); 
  }); 
});

功能说明 #

• 反向覆盖输入框：通过$('#txtx1').val($("#txtSpan").text())，把SPAN中的内容重新赋值给#txtx1输入框，实现双向同步。
• 同步到GrandTotal：直接将SPAN的文本内容写入只读的#GrandTotal输入框，满足你汇总结果的需求。

如果后续SPAN中的内容是经过计算后的动态值（比如不是直接从输入框获取，而是通过其他逻辑计算得出），这个代码依然适用，只要确保#txtSpan的文本是你需要同步的最终值即可。

内容的提问来源于stack exchange，提问作者erkind dunya