【发布时间】：2016-06-20 06:44:24
【问题描述】：
我正在使用 W3 验证器验证我的 HTML，当它检查我的页面时，我收到了一个验证错误：
标签元素最多可以包含一个按钮，输入，keygen， 仪表、输出、进度、选择或文本区域后代。从线 136，第 33 栏；到第 136 行，第 76 列 2 拉丁
我不完全确定出了什么问题，因为据我所知，我在标签中只使用了一种输入类型。
这是我的代码：
<label> Rating
<br>
<input type="radio" name="rating" value="1"> 1
<br>
<input type="radio" name="rating" value="2"> 2
<br>
<input type="radio" name="rating" value="3"> 3
<br>
<input type="radio" name="rating" value="4"> 4
<br>
<input type="radio" name="rating" value="5"> 5
<br>
<input type="radio" name="rating" value="6"> 6
<br>
<input type="radio" name="rating" value="7"> 7
<br>
<input type="radio" name="rating" value="8"> 8
<br>
<input type="radio" name="rating" value="9"> 9
<br>
<input type="radio" name="rating" value="10"> 10
<br>
</label>
无论哪种方式，网页都可以正常工作，如果可能，我想修复验证。
如果需要，这是我整个页面的代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Contact</title>
<link rel="stylesheet" type="text/css" href="Bootstrap/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/Slideshow.css">
<link rel="stylesheet" type="text/css" href="css/page.css">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1> Nathan Rivera </h1>
<h1> Portfolio </h1>
</div>
</div>
</div>
<script>
function checkforblank() {
if (document.getElementById('name').value == "") {
alert("Entry can't be empty");
document.getElementById('name').style.borderColor = "red";
return false;
}
if (document.getElementById('email').value == "") {
alert("Entry can't be empty");
document.getElementById('email').style.borderColor = "red";
return false;
}
var radios = document.getElementsByName("rating");
var formValid = false;
var i = 0;
while (!formValid && i < radios.length) {
if (radios[i].checked) formValid = true; {
i++;
}
}
if (!formValid) {
alert("Please Pick Rating");
return formValid;
document.getElementsByName("rating").style.borderColor = "red";
}
}
</script>
</head>
<body>
<div class="container">
<div class="row" id="inner">
<div class="col-lg-12 center">
<ul class="nav nav-pills">
<li><a href="index.html">Homepage</a></li>
<li><a href="Portfolio.html">Portfolio</a></li>
<li><a href="Projects.html">Projects</a></li>
<li><a href="Contact.html">Contact</a></li>
<li class="active"><a href="Survey.html">Survey</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="col-md-12">
<form method="post" action "#" onSubmit="return checkforblank()">
<fieldset>
<label> Name:
<br>
<input type="text" id="name" name="name">
</label>
<br>
<br>
<label> Email:
<br>
<input type="text" id="email" name="email">
</label>
<br>
<br>
<label> Rating
<br>
<input type="radio" name="rating" value="1"> 1
<br>
<input type="radio" name="rating" value="2"> 2
<br>
<input type="radio" name="rating" value="3"> 3
<br>
<input type="radio" name="rating" value="4"> 4
<br>
<input type="radio" name="rating" value="5"> 5
<br>
<input type="radio" name="rating" value="6"> 6
<br>
<input type="radio" name="rating" value="7"> 7
<br>
<input type="radio" name="rating" value="8"> 8
<br>
<input type="radio" name="rating" value="9"> 9
<br>
<input type="radio" name="rating" value="10"> 10
<br>
</label>
<br>
<br>
<div class="form-group">
<label for="comments">Comments:</label>
<textarea class="form-control" rows="5" id="comments"></textarea>
</div>
</fieldset>
</form>
<form action="javascript:alert('Thank You For Your Input')" method="get" onSubmit="return checkforblank()">
<input type="submit" value="Submit">
</form>
</div>
</div>
</div>
</div>
<script src="Bootstrap/js/bootstrap.js"></script>
<script src="Jquery/jquery-1.12.3.js"></script>
</body>
</html>
【问题讨论】：
-
快速提问....为什么你用 JS 来做这件事，而你可以用 jQuery 来做这件事？
-
因为我还没有弄清楚如何使用jquery。总的来说，JavaScript 真的让我很困惑。
-
在你的项目中包含一个 jQuery 文件，你可以得到这样的元素，例如： if($('email').val()=="")... 这样你可以写更清洁、更高效的代码... :)
-
感谢您的提示。我刚刚也学会了如何使用引导程序。
标签： html validation label