您好我是JavaScript的新手,所以我需要一些帮助。
我有这个带有单选按钮的简单html表单。有20个问题,每个问题都必须回答,所以我需要某种形式的验证,在访问者点击提交按钮之前检查每个问题是否得到解答? (检查是否选中了单选按钮)
提前谢谢你。
<form action="rezultatiFU.php" method="post">
<ol>
<li>
<h3>Koji ste pol?</h3>
<div>
<input type='radio' name='answer1' id='answer1' value='A' />
<label for='answer1A'>Muško</label>
</div>
<div>
<input type='radio' name='answer1' id='answer1' value='B' />
<label for='answer1B'>Žensko</label>
</div>
</li>
<li>
<h3>Koliko imate godina?</h3>
<div>
<input type='radio' name='answer2' id='answer2' value='A' />
<label for='answer2A'>18-25</label>
</div>
<div>
<input type='radio' name='answer2' id='answer2' value='B' />
<label for='answer2B'>25-35</label>
</div>
<div>
<input type='radio' name='answer2' id='answer2' value='C' />
<label for='answer2C'>35-45</label>
</div>
<div>
<input type='radio' name='answer2' id='answer2' value='D' />
<label for='answer2D'><45</label>
</li>
<li>
<h3>Koliko ste visoki? (cm)</h3>
<div>
<input type='text' name='answer3' id='answer3' />
</div>
</li>
<li>
<h3>Koliko imate kilograma?</h3>
<div>
<input type='text' name='answer4' id='answer4' />
</div>
</li>
<li>
<h3>Da li Vaš posao zahteva kretanje ili neku fizičku aktivnost?</h3>
<div>
<input type='radio' name='answer5' id='answer5' value='A' />
<label for='answer5A'>Da</label>
</div>
<div>
<input type='radio' name='answer5' id='answer5' value='B' />
<label for='answer5B'>Ne</label>
</div>
</li>
<li>
<h3>Da li ste dijabetičar?</h3>
<div>
<input type='radio' name='answer6' id='answer6' value='A' />
<label for='answer6A'>Da</label>
</div>
<div>
<input type='radio' name='answer6' id='answer6' value='B' />
<label for='answer6B'>Ne</label>
</div>
</li>
<li>
<h3>Koliko tečnosti unosite tokom dana?</h3>
<div>
<input type='radio' name='answer7' id='answer7' value='A' />
<label for='answer7A'>Ispod 2 litre</label>
</div>
<div>
<input type='radio' name='answer7' id='answer7' value='B' />
<label for='answer7B'>2 litre</label>
</div>
<div>
<input type='radio' name='answer7' id='answer7' value='C' />
<label for='answer7C'>Preko 2 litre</label>
</div>
</li>
<li>
<h3>Da li doručkujete?</h3>
<div>
<input type='radio' name='answer8' id='answer8' value='A' />
<label for='answer8A'>Da</label>
</div>
<div>
<input type='radio' name='answer8' id='answer8' value='B' />
<label for='answer8B'>Ne</label>
</div>
<div>
<input type='radio' name='answer8' id='answer8' value='C' />
<label for='answer8C'>Ponekad, kada stignem</label>
</div>
</li>
<li>
<h3>Koliko često se bavite fizičkom aktivnošću?</h3>
<div>
<input type='radio' name='answer9' id='answer9' value='A' />
<label for='answer9A'>Skoro nikada</label>
</div>
<div>
<input type='radio' name='answer9' id='answer9' value='B' />
<label for='answer9B'>Jednom nedeljno</label>
</div>
<div>
<input type='radio' name='answer9' id='answer9' value='C' />
<label for='answer9C'>Više puta nedeljno</label>
</div>
<div>
<input type='radio' name='answer9' id='answer9' value='D' />
<label for='answer9D'>Svaki dan</label>
</div>
</li>
<li>
<h3>Koliko obroka imate tokom dana?</h3>
<div>
<input type='radio' name='answer10' id='answer10' value='A' />
<label for='answer10A'>1-2</label>
</div>
<div>
<input type='radio' name='answer10' id='answer10' value='B' />
<label for='answer10B'>3</label>
</div>
<div>
<input type='radio' name='answer10' id='answer10' value='C' />
<label for='answer10C'>5 i više</label>
</div>
</li>
<li>
<h3>Da li konzumirate hranu sa velikim udelom masti?</h3>
<div>
<input type='radio' name='answer11' id='answer11' value='A' />
<label for='answer11A'>Da</label>
</div>
<div>
<input type='radio' name='answer11' id='answer11' value='B' />
<label for='answer11B'>Izbegavam masnu hranu</label>
</div>
<div>
<input type='radio' name='answer11' id='answer11' value='C' />
<label for='answer11C'>Ponekad</label>
</div>
</li>
<li>
<h3>Da li konzumirate hranu sa velikim količinama šećera? (slatkiši, sokovi sa šećerom i sl.)</h3>
<div>
<input type='radio' name='answer12' id='answer12' value='A' />
<label for='answer12A'>Da, uživam u takvoj hrani</label>
</div>
<div>
<input type='radio' name='answer12' id='answer12' value='B' />
<label for='answer12B'>Ne, izbegavam kad god mogu</label>
</div>
<div>
<input type='radio' name='answer12' id='answer12' value='C' />
<label for='answer12C'>Ponekad</label>
</div>
</li>
<li>
<h3>Koliko često jedete voće i povrće?</h3>
<div>
<input type='radio' name='answer13' id='answer13' value='A' />
<label for='answer13A'>Svaki dan</label>
</div>
<div>
<input type='radio' name='answer13' id='answer13' value='B' />
<label for='answer13B'>Retko</label>
</div>
</li>
<li>
<h3>Koliko kalorija unesete tokom dana? (odprilike)?</h3>
<div>
<input type='radio' name='answer14' id='answer14' value='A' />
<label for='answer14A'>Nedovoljno</label>
</div>
<div>
<input type='radio' name='answer14' id='answer14' value='B' />
<label for='answer14B'>Dovoljno</label>
</div>
<div>
<input type='radio' name='answer14' id='answer14' value='C' />
<label for='answer14C'>Previše</label>
</div>
</li>
<li>
<h3>Koliko često konzumirate alkohol?</h3>
<div>
<input type='radio' name='answer15' id='answer15' value='A' />
<label for='answer15A'>Jednom nedeljno</label>
</div>
<div>
<input type='radio' name='answer15' id='answer15' value='B' />
<label for='answer15B'>Više puta nedeljno</label>
</div>
<div>
<input type='radio' name='answer15' id='answer15' value='C' />
<label for='answer15C'>Jednom mesečno</label>
</div>
<div>
<input type='radio' name='answer15' id='answer15' value='D' />
<label for='answer15D'>Nikada ili jako retko</label>
</div>
</li>
<li>
<h3>Koliko često konzumirate hranu iz FastFood restorana?</h3>
<div>
<input type='radio' name='answer16' id='answer16' value='A' />
<label for='answer16A'>Svaki dan</label>
</div>
<div>
<input type='radio' name='answer16' id='answer16' value='B' />
<label for='answer16B'>Svaki drugi dan</label>
</div>
<div>
<input type='radio' name='answer16' id='answer16' value='C' />
<label for='answer16C'>Jednom nedeljno</label>
</div>
<div>
<input type='radio' name='answer16' id='answer16' value='D' />
<label for='answer16D'>Ne jedem u Fast Food restoranima</label>
</div>
</li>
<li>
<h3>Koliko često jedete pečenu hranu?</h3>
<div>
<input type='radio' name='answer17' id='answer17' value='A' />
<label for='answer17A'>Svaki dan</label>
</div>
<div>
<input type='radio' name='answer17' id='answer17' value='B' />
<label for='answer17B'>Svaki drugi dan</label>
</div>
<div>
<input type='radio' name='answer17' id='answer17' value='C' />
<label for='answer17C'>Jednom nedeljno</label>
</div>
<div>
<input type='radio' name='answer17' id='answer17' value='D' />
<label for='answer17D'>Ne jedem pečenu hranu</label>
</div>
</li>
<li>
<h3>Kada ogladnite a nije vreme za obrok, šta pojedete?</h3>
<div>
<input type='radio' name='answer18' id='answer18' value='A' />
<label for='answer18A'>Čips</label>
</div>
<div>
<input type='radio' name='answer18' id='answer18' value='B' />
<label for='answer18B'>Kokice</label>
</div>
<div>
<input type='radio' name='answer18' id='answer18' value='C' />
<label for='answer18C'>Semenke, kikiriki, lešnik, badem</label>
</div>
<div>
<input type='radio' name='answer18' id='answer18' value='D' />
<label for='answer18D'>Slatkiše</label>
</div>
<div>
<input type='radio' name='answer18' id='answer18' value='E' />
<label for='answer18E'>Voće</label>
</div>
<div>
<input type='radio' name='answer18' id='answer18' value='F' />
<label for='answer18F'>Popijem tečnost i čekam da pregladnim</label>
</div>
</li>
<li>
<h3>Da li jedete i kada niste gladni?</h3>
<div>
<input type='radio' name='answer19' id='answer19' value='A' />
<label for='answer19A'>Da</label>
</div>
<div>
<input type='radio' name='answer19' id='answer19' value='B' />
<label for='answer19B'>Ne</label>
</div>
</li>
<li>
<h3>Okarakterišite sebe?</h3>
<div>
<input type='radio' name='answer20' id='answer20' value='A' />
<label for='answer20A'>Optimista</label>
</div>
<div>
<input type='radio' name='answer20' id='answer20' value='B' />
<label for='answer20B'>Pesimista</label>
</div>
</li>
<br/>
<input type="image" src="http://www.programtreninga.com/slike/dugmetest.png" alt="Submit Form" width="110" />
<p><strong>* Napomena: morate odgovoriti na sva pitanja kako biste dobili tačan rezultat!</strong></p>
</ol>
</form>
答案 0 :(得分:0)
简单的方法就是这样:
if( document.querySelectorAll("input[type=radio]:checked").length < 20) {
alert("You didn't answer all the questions");
return false;
}
答案 1 :(得分:0)
您也可以使用jquery
进行验证。
var names = {};
$('input:radio').each(function() {
names[$(this).attr('name')] = true;
});
var count = 0;
$.each(names, function() {
count++;
});
if($('input:radio:checked').length == count) {
// all questions answered
}