javascript:如何提取在此表单中输入的值?

标签 javascript html forms input

这对我不起作用。谁能告诉我我做错了什么?

function showValues() {
  var uIwD;
  uIwD = document.getElementById(uInputs.fWD);
  alert ("You entered: " + uIwD);
}
<form id="uInputs">
  Enter a value in the first field, then press Submit:<br>

  <input type="number" id="fWD" value="" min="0" max ="6">
  Weekday (0 to 6 for Sun to Sat)<br>

  <input type="number" name="fHr" value="" min="0" max ="23">
  Hour (0 to 23)<br>

  <input type="number" name="fMins" value="" min="0" max ="59">
  Minutes (0 to 59)<br>

  <input type="number" name="fSecs" value="" min="0" max ="59">
  Seconds (0 to 59)<br>

  <input type="number" name="fWOffset" value="-6" min="-12" max ="12">
  wOffsetHours (-12 to 12)<br>

  <input type="button" value="Submit" onclick="showValues()">
</form>

我在第一个输入字段中输入值 3,然后单击“提交”,然后我收到一个 js 警报弹出窗口,显示“您输入了:null”

我曾尝试在第一个输入字段中将 name= 替换为 ID=,然后在 GetElementbyID() 中仅使用该 ID,但结果是一样的。

Here是一个工作页面,您可以在其中查看结果。 (我试着为它制作一个 fiddle ,但是当我在 jsfiddle 中运行它时,我根本没有收到任何警报消息。js 警报弹出窗口似乎在 jsfiddle 中不起作用。)

最佳答案

您访问错误。 id 应该是一个字符串,然后您可以访问具有 id 作为属性的 Childs。

例如测试第一个输入框

  function showValues() {
    var uIwD;
    var uIwD = document.getElementById("uInputs");
    alert ("You entered: " + uIwD.fWD.value);
    }
</head>
<body>

 <form id="uInputs">
 Enter a value in the first field, then press Submit:<br>

 <input type="number" id="fWD" value="" min="0" max ="6">
 Weekday (0 to 6 for Sun to Sat)<br>

 <input type="number" name="fHr" value="" min="0" max ="23">
 Hour (0 to 23)<br>

 <input type="number" name="fMins" value="" min="0" max ="59">
 Minutes (0 to 59)<br>

 <input type="number" name="fSecs" value="" min="0" max ="59">
 Seconds (0 to 59)<br>

 <input type="number" name="fWOffset" value="-6" min="-12" max ="12">
 wOffsetHours (-12 to 12)<br>

 <input type="button" value="Submit" onclick="showValues()">
 </form>

关于javascript:如何提取在此表单中输入的值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45585376/

相关文章:

javascript - SAPUI5 - 如何获取我的自定义控件绑定(bind)到的模型的名称?

javascript - 如何删除AngularJS中的缓存?

jquery - 带有下一个和上一个 jQuery 的自定义模式

html - 如果我只喜欢在 HTML 文件中引导,如何在 SASS 中扩展引导类?

jquery - 如何使用带有验证功能的 jQuery 在 Modal 中创建 .NET MVC 表单

javascript - 在窗口中重新调整 Google 图表的大小

javascript - JQueryUI sortable 只能工作一次

php - 在 PHP 中使用 Pdfcrowd 将 HTML 转换为 PDF

javascript - Rails - 无法访问表单中的实例变量

javascript - 自动检测输入并相应更改图像的 html 表单