javascript - 使用javascript替换表单中的文本

Question

我有一个包含多个字段的表单。第一个字段称为主题。我想要做的是禁用用户在字段中输入的功能，但它仍然显示，并且他们输入到其他三个字段的文本显示在第一个字段中的变量之间有空格。示例：在这种情况下：“Second_Field: John”“Third_Field: Doe”“Forth_Field: New part”然后在第一个字段，主题上，它将显示：John Doe New Part

谢谢你的帮助。

Answer 1

您可以尝试以下方法：

<!-- HTML -->
<input type="text" id="subject" disabled="disabled">
<input type="text" id="field1">
<input type="text" id="field2">
<input type="text" id="field3">

// JavaScript
var fields = [];
for (var i = 1; i <= 3; i++) {
    fields.push(document.getElementById("field" + i).value);
}
document.getElementById("subject").value = fields.join(" ");

Answer 2

尝试这个：

<script>
function UpdateText()
{
  document.getElementById("subject").value =document.getElementById("Field1").value + " " +   document.getElementById("Field2").value + " " + document.getElementById("Field3").value;
}
</script>

<input type="text" id="subject" disabled="disabled"/>
<input type="text" id="Field1" onchange="UpdateText()";/>
<input type="text" id="Field2" onchange="UpdateText()";/>
<input type="text" id="Field3" onchange="UpdateText()";/>

Answer 3

HTML：

<form>
<p><input id="subject" name="subject" disabled size="60"></p>
<p><input id="Second_Field" class="part">
   <input id="Third_Field" class="part">
   <input id="Fourth_Field" class="part"></p>
</form>

​</p>

JavaScript：

var updateSubject = function() {
  var outArray = [];
  for (var i=0;i<parts.length;i++) {
      if (parts[i].value !== '' ) {
        outArray.push(parts[i].value);
      }
  }
  document.getElementById('subject').value = outArray.join(' ');
};
var parts = document.getElementsByClassName('part');
for (var i=0;i<parts.length;i++) {
  parts[i].onkeydown = updateSubject;
}

​</p>