Javascript 在另一个字段中显示html表单的输入值_Javascript_Html_Forms

Javascript 在另一个字段中显示html表单的输入值

javascript html forms

Javascript 在另一个字段中显示html表单的输入值,javascript,html,forms,Javascript,Html,Forms,我有一个html表单，其中包含由用户填写的字段。我也有单选按钮，当点击时会在文本区域显示一段特定的文本。我想做的是获取用户填写的给定名称值，并在单选按钮触发的文本中显示该值。我已经添加了到目前为止的代码获取个人信息（如姓名）的代码 <!DOCTYPE html> <html> <head> <form class="form-inline" action="/action_page.php"> <label for="Gender"

我有一个html表单，其中包含由用户填写的字段。我也有单选按钮，当点击时会在文本区域显示一段特定的文本。我想做的是获取用户填写的给定名称值，并在单选按钮触发的文本中显示该值。我已经添加了到目前为止的代码

获取个人信息（如姓名）的代码

<!DOCTYPE html>
<html>
<head> 

<form class="form-inline" action="/action_page.php">
  <label for="Gender">Gender:</label>
  <option="text" id="cName" placeholder="Gender" name="cName" size="40">
  <Select name="nom" size="1"
  <option>Mr
  <option>Mr
  <option>Ms
  </select>
  </form>

<label for="fName">Family Name:</label>
  <input type="text" id="fName" placeholder="Family Name" name="fName"> 
  <label for="gName">Given Name:</label>
  <input type="text" id="gName" placeholder="Given Name" name="gName" 
  <label for="dob">DOB:</label>
  <input type="date" id="dob" placeholder="DOB" name="dob">

  <p id="dob"></p> 

</head>
</form>


性别：
如果要从输入元素中获取值，可以执行以下操作：
<SCRIPT LANGUAGE="JavaScript">
function testResults (form) {
  var TestVar1 = form.input[0].checked;
  var TestVar2 = form.input[1].checked;
  var TestVar3 = form.input[2].checked; 
  var TestVar4 = form.input[3].checked;
  var userName = document.getElementById('gName').value;  <----
  if (TestVar1 == true) {
    form.textbox.value = "We hereby certify that " + userName + " , born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT.";
  } else if (TestVar2 == true){
    form.textbox.value = "We hereby certify that NAME2, born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT.";
  } else if (TestVar3 == true) {
      form.textbox.value = "We hereby certify that NAME3, born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT.";   
  } else if (TestVar4 == true) {
      form.textbox.value = "We hereby certify that NAME4, born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT."; 
  }else if (TestVar1 == false && TestVar2 == false && TestVar3 == false && TestVar4 == false) {
    form.textbox.value = "";
  }
}


函数测试结果（表格）{
var TestVar1=form.input[0]。已选中；
var TestVar2=form.input[1]。已选中；
var TestVar3=form.input[2]。已选中；
var TestVar4=form.input[3]。已选中；
var userName=document.getElementById（'gName'）.value；如果要从输入元素获取值，可以执行以下操作：
<SCRIPT LANGUAGE="JavaScript">
function testResults (form) {
  var TestVar1 = form.input[0].checked;
  var TestVar2 = form.input[1].checked;
  var TestVar3 = form.input[2].checked; 
  var TestVar4 = form.input[3].checked;
  var userName = document.getElementById('gName').value;  <----
  if (TestVar1 == true) {
    form.textbox.value = "We hereby certify that " + userName + " , born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT.";
  } else if (TestVar2 == true){
    form.textbox.value = "We hereby certify that NAME2, born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT.";
  } else if (TestVar3 == true) {
      form.textbox.value = "We hereby certify that NAME3, born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT.";   
  } else if (TestVar4 == true) {
      form.textbox.value = "We hereby certify that NAME4, born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT."; 
  }else if (TestVar1 == false && TestVar2 == false && TestVar3 == false && TestVar4 == false) {
    form.textbox.value = "";
  }
}


函数测试结果（表格）{
var TestVar1=form.input[0]。已选中；
var TestVar2=form.input[1]。已选中；
var TestVar3=form.input[2]。已选中；
var TestVar4=form.input[3]。已选中；
var userName=document.getElementById（'gName'）.value；首先，代码中存在一些问题，例如您将
标记放在
标记中，在
标记之前关闭了
标记，等等
但无论如何，为了获得用户输入的名称，请使用
var fName = document.getElementById("fName").value;

你可以在任何地方使用这个变量
form.textbox.value = "We hereby certify that "+fName+", born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT.";

首先，您的代码中存在一些问题，例如您将
标记放在
标记中，您在
标记之前关闭了
标记，等等
但无论如何，为了获得用户输入的名称，请使用
var fName = document.getElementById("fName").value;

你可以在任何地方使用这个变量
form.textbox.value = "We hereby certify that "+fName+", born on MONTH, DAY, YEAR, was employed by LEGAL ENTITY, from MONTH DAY, YEAR to Month DAY, YEAR and held the position of ROLE, reporting to the DEPARTMENT.";

您可以通过两种方式获得输入值
Javascript
var givenName=document.getElementById（gName）.value
//gName是输入的id
Jquery
var givenName = $("#gName").val();

如果您使用jQuery，请确保包含jQuery库。
您可以通过两种方式获取输入值
Javascript
var givenName=document.getElementById（gName）.value
//gName是输入的id
Jquery
var givenName = $("#gName").val();

如果您正在使用jQuery，请确保包含jQuery库