检查javascript中的空表单元素

我正在做一个简单的客户端自评分测验

我问了6个问题，我想提醒用户他们的分数（保持简单）。如果他们将答案留空，则会出现警报

我是javascript新手，不知道如何检查单个表单元素是否为空。我在运行代码时也遇到了问题

JS

编辑

检查各个表单元素以查看它们是否为空

您只需将该值与空字符串进行比较：

if(elt.question6.value == '') {
  alert('Unanswered');
}

检查各个表单元素以查看它们是否为空

您只需将该值与空字符串进行比较：

if(elt.question6.value == '') {
  alert('Unanswered');
}

---

您可以使用jquerys内置验证。它具有内置功能，可以检查必填项，并在空白字段下方显示错误消息。

您可以使用jquerys内置验证。它具有内置功能，可以检查必填项，并在空白字段下方显示错误消息。

您的标记中有一些重大错误：

不要将

表单

元素围绕每个问题。这些都应该是一个

表单

元素。（此外，每个问题都应在

OL

中，以便对问题进行编号。）

您没有正确关闭所有的

标签

，因此当您单击它们时，它们正在选择其他元素（请尝试问题3，第一个复选框）

您需要表单的

submit

处理程序上的

grade（）

函数，并且它需要是

onsubmit=“return grade（）”

，当它没有“通过”以防止表单提交时，

grade（）

返回

false

*注意，在示例中，我将

grade（）

函数设置为始终

returnfalse

。您需要添加允许表单提交的逻辑

至于Javascript

您需要

elt

变量等于您的

文档。quick

（注意，我更改了主

表单

，使标记中有一个

name=“quick”

）。如果您只想进行简单的检查，可以使用

indexOf（）

代替正则表达式（不过正则表达式可以将

age

作为一个单词进行检查）

如果只想确保文本输入不为空，可以使用

el.value.length！=0

或

el.value！=''

另外，看看你的评分代码，如果你只想选择一个，你可以使用收音机，除非你想让参加测验的人不知道一个或多个答案是否有效。但是收音机只允许你选择一个值

HTML

<h3> Self-Grading Astronomy Quiz </h3>
<form action="" name="quiz" onsubmit="return grade();">
 <p>1. According to Kepler the orbit of the earth is a circle with the sun at the center.</p>
 <p>
  <label><input type="radio" name="question1" value="true" /> True </label>
  <label><input type="radio" name="question1" value="false" /> False </label>
 </p>
 <p>2. Ancient astronomers did consider the heliocentric model of the solar system but rejected it because they could not detect parallax.</p>
 <p>
  <label><input type="radio" name="question2" value="true" /> True </label>
  <label><input type="radio" name="question2" value="false" /> False </label>
 </p>
 <p>3. The total amount of energy that a star emits is directly related to its:</p>
 <p>
  <label><input type="checkbox" name="question3" value="1" /> a) surface gravity and magnetic field </label><br/>
  <label><input type="checkbox" name="question3" value="2" /> b) radius and temperature </label><br/>
  <label><input type="checkbox" name="question3" value="3" /> c) pressure and volume </label><br/>
  <label><input type="checkbox" name="question3" value="4" /> d) location and velocity </label>
 </p>
 <p>4. Stars that live the longest have:</p>
 <p>
  <label><input type="checkbox" name="question4" value="1" /> a) high mass </label><br/>
  <label><input type="checkbox" name="question4" value="2" /> b) high temperature </label><br/>
  <label><input type="checkbox" name="question4" value="3" /> c) lots of hydrogen </label><br/>
  <label><input type="checkbox" name="question4" value="4" /> d) small mass </label>
 </p>
 <p>5. A collection of a hundred billion stars, gas, and dust is called a __________.</p>
 <p>
  <input type='text' id='question5' />
 </p>
 <p>6. The inverse of the Hubble's constant is a measure of the __________ of the universe.</p>
 <p>
  <input type='text' id='question6' />
 </p>
 <p>
  <input type='button' onclick='grade()' value='Grade' />
 </p>
</form>

您的标记中有一些重大错误：

不要将
表单
元素围绕每个问题。这些都应该是一个
表单
元素。（此外，每个问题都应在
OL
中，以便对问题进行编号。）
您没有正确关闭所有的
标签
，因此当您单击它们时，它们正在选择其他元素（请尝试问题3，第一个复选框）
您需要表单的
submit
处理程序上的
grade（）
函数，并且它需要是
onsubmit=“return grade（）”
，当它没有“通过”以防止表单提交时，
grade（）
返回
false
*注意，在示例中，我将
grade（）
函数设置为始终
returnfalse
。您需要添加允许表单提交的逻辑

至于Javascript

您需要
elt
变量等于您的
文档。quick
（注意，我更改了主
表单
，使标记中有一个
name=“quick”
）。如果您只想进行简单的检查，可以使用
indexOf（）
代替正则表达式（不过正则表达式可以将
age
作为一个单词进行检查）

如果只想确保文本输入不为空，可以使用
el.value.length！=0
或
el.value！=''

另外，看看你的评分代码，如果你只想选择一个，你可以使用收音机，除非你想让参加测验的人不知道一个或多个答案是否有效。但是收音机只允许你选择一个值

HTML

<h3> Self-Grading Astronomy Quiz </h3>
<form action="" name="quiz" onsubmit="return grade();">
 <p>1. According to Kepler the orbit of the earth is a circle with the sun at the center.</p>
 <p>
  <label><input type="radio" name="question1" value="true" /> True </label>
  <label><input type="radio" name="question1" value="false" /> False </label>
 </p>
 <p>2. Ancient astronomers did consider the heliocentric model of the solar system but rejected it because they could not detect parallax.</p>
 <p>
  <label><input type="radio" name="question2" value="true" /> True </label>
  <label><input type="radio" name="question2" value="false" /> False </label>
 </p>
 <p>3. The total amount of energy that a star emits is directly related to its:</p>
 <p>
  <label><input type="checkbox" name="question3" value="1" /> a) surface gravity and magnetic field </label><br/>
  <label><input type="checkbox" name="question3" value="2" /> b) radius and temperature </label><br/>
  <label><input type="checkbox" name="question3" value="3" /> c) pressure and volume </label><br/>
  <label><input type="checkbox" name="question3" value="4" /> d) location and velocity </label>
 </p>
 <p>4. Stars that live the longest have:</p>
 <p>
  <label><input type="checkbox" name="question4" value="1" /> a) high mass </label><br/>
  <label><input type="checkbox" name="question4" value="2" /> b) high temperature </label><br/>
  <label><input type="checkbox" name="question4" value="3" /> c) lots of hydrogen </label><br/>
  <label><input type="checkbox" name="question4" value="4" /> d) small mass </label>
 </p>
 <p>5. A collection of a hundred billion stars, gas, and dust is called a __________.</p>
 <p>
  <input type='text' id='question5' />
 </p>
 <p>6. The inverse of the Hubble's constant is a measure of the __________ of the universe.</p>
 <p>
  <input type='text' id='question6' />
 </p>
 <p>
  <input type='button' onclick='grade()' value='Grade' />
 </p>
</form>

标记“清理”：请不要在属性、属性的
=
和引用值之间放置空格<代码>：）
@Jared谢谢你清理它！标记“清理”：请不要在属性、属性的
=
和引用值之间放置空格<代码>：）

@Jared谢谢你清理它！Jquerys验证将一切都隐藏在阳光下，如果有您看不到的东西，则可以添加您自己的自定义验证功能。非常酷的东西。Jquerys验证拥有一切，如果有你看不到的东西，可以添加你自己的自定义验证功能。非常酷的东西。这对选择题和对/错答案有效还是只对简短答案有效？这对选择题和对/错答案有效还是只对简短答案有效？谢谢！但最后一个问题是，当使用el.value.length！=如果（question1.value.length！=0）{alert（“error”）；}正确吗？嘿，Jared，很抱歉问了这么多问题，但我还有一个问题……我更新了JSFIDLE，添加了一行代码，查找任何可能的空答案。我还在问题5和6中添加了toLowerCase（），以防用户使用大写字符。不知怎的，当我做了所有这些，我把代码搞砸了，因为现在它不工作了。介意看看吗？谢谢似乎没有更新。我正在将我的JS添加到我的原始帖子中。你需要给我链接（我不知道其他情况）。还有，我姑妈碰巧在开普勒宇宙飞船上工作（她是美国宇航局的工程师）。@Rich2233-看到底部的小提琴了吗