如何在输入字段中设置静态文本？答案

【问题标题】：How can I set static text in an input field?如何在输入字段中设置静态文本？
【发布时间】：2021-10-17 19:59:17
【问题描述】：

我已经阅读了许多与此主题相关的文章，但这些文章都没有为我想要实现的目标提供确切的解决方案。我想在“以下代码中的部门”的输入字段中将“计算机科学”设为静态文本。

<table>
  <tr>
    <td><label for="Username">Username</label></td>
    <td><input name="txtusername" type="text" id="txtusername" style="height:20px; width:208px" /></td>
  </tr>

  <tr>
    <td><label for="Password">Password</label></td>
    <td><input name="txtpassword" type="password" id="txtpassword" style="height:20px; width:208px" /></td>
  </tr>

  <tr>
    <td><label for="Lastname">Lastname</label></td>
    <td><input name="txtlastname" type="text" id="txtlastname" style="height:20px; width:208px" /></td>
  </tr>

  <tr>
    <td><label for="Firstname">Firstname</label></td>
    <td><input name="txtfirstname" type="text" id="txtfirstname" style="height:20px; width:208px" /></td>
  </tr>

  <tr>
    <td><label for="Sex">Sex</label></td>
    <td>
      <select name="sex" class="form-control" required>
        <option value=""> ----- </option>
        <option value="Male">Male</option>
        <option value="Female">Female</option>

      </select>
    </td>
  </tr>

  <tr>
    <td><label for="ContactNo">Contact No</label></td>
    <td><input name="txtcontactno" type="text" id="txtcontactno" style="height:20px; width:208px" /></td>
  </tr>

  <tr>
    <td><label for="MatricNo">Matric No</label></td>
    <td><input name="txtmatricno" type="text" id="txtmatricno" style="height:20px; width:208px" /></td>
  </tr>


  <tr>
    <td><label for="Programme">Programme</label></td>
    <td><input name="txtprogramme" type="text" id="txtprogramme" style="height:20px; width:208px" /></td>
  </tr>

  <tr>
    <td><label for="Department">Department</label></td>
    <td> <input name="txtdept" type="text" id="txtdept" style="height:20px; width:208px" /></td>
  </tr>

  <tr>
    <td><label for="CFaculty">Faculty</label></td>
    <td><input name="txtfaculty" type="text" id="txtfaculty" style="height:20px; width:208px" /></td>
  </tr>
  <tr>
    <td><label for="UploadPhoto">UploadPhoto</label></td>
    <td><input type="file" name="image" /> </td>
  </tr>
  <tr>
    <td></td>
    <td><input type="submit" name="add" value="Register" id="submit" />
      <input type="submit" name="Reset" value="Cancel" id="Reset" />
    </td>
  </tr>
</table>

我想达到与附图中输出类似的结果：

非常感谢任何建议或建议。

【问题讨论】：

这需要一些时间，我正在做这个。
只需使用disabled 作为输入字段的属性。

标签： html css forms input

【解决方案1】：

如前所述，禁用输入字段将是第一步。

    <tr>
    <td><label for="Department">Department</label></td>
    <td><input name="txtdept" type="text" id="txtdept" style="height:20px; width:208px" disabled/></td>
    </tr>

如果部门的值需要是静态的，直接在输入框定义即可。

<td><input name="txtdept" type="text" id="txtdept" style="height:20px; width:208px" value="COMPUTER SCIENCE" disabled/></td>

如果部门与来自其他输入字段的值有关联，理论上您可以使用带有一些 If-Statements 的 JS。

$(document).ready(function(){
    var txtdept = document.getElementById("txtdept");
    txtdept.value = "COMPUTER SCIENCE";
});

【讨论】：

【解决方案2】：

不太清楚你所说的静态文本是什么意思，但你有两种方法来处理图像中的内容：你可以添加 placeholder="COMPUTER SCIENCE" 输入

<input name="txtdept" type="text" id="txtdept" style="height:20px; width:208px" placeholder="COMPUTER SCIENCE" />

和/或添加value="COMPUTER SCIENCE"。

<input name="txtdept" type="text" id="txtdept" style="height:20px; width:208px"  placeholder="COMPUTER SCIENCE" value="COMPUTER SCIENCE" />

占位符用于在输入为空时显示。该值将只是输入的默认值，并且可以由用户更改。如果您不希望用户更改输入的内容，可以在输入中添加禁用。

<input name="txtdept" type="text" id="txtdept" style="height:20px; width:208px" value="COMPUTER SCIENCE" disabled/>

【讨论】：