Я иду через процесс проверки мой HTML с использованием W3 валидатора, когда он проверяет через мои страницы я получаю сообщение об ошибке проверки:проверка ошибок для радио-кнопки в HTML
The label element may contain at most one button, input, keygen, meter, output, progress, select, or textarea descendant. From line 136, column 33; to line 136, column 76 2 Ratin
Я не совсем уверен, что не так, потому что, насколько я могу судить, я использовал только один тип ввода в метке.
Вот мой код для этого сегмента:
<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? – perkes456
Потому что я havent понял, как использовать jquerry. JavaScript в целом действительно запутан для меня. –
Включите в проект файл jQuery, и вы можете получить такой элемент, например: if ($ ('email'). Val() == "") ... Таким образом вы можете написать гораздо более чистый и эффективный код. .. :) – perkes456