Есть код который рисует в рамке радиобатоны и работает с ними.Но хотелось бы зделать так допустим в тесте варианты ответов одинаковы всегда Да или Нет.Когда я убираю отсюдова текст который будет рисоватса рядом с радиобаттоном
$('.bond').append('<label><input name="group2" type="radio">'+a+'</label>');
и создаю его отдельно и далее добавляю за рамкой
answer=$(xml).find('answer')[0].textContent;
$('.cont2').append('<p><label><h4>'+answer+'</h4></label></p>');
answer=$(xml).find('answer')[1].textContent;
$('.cont3').append('<p><label><h4>'+answer+'</h4></label></p>');
Непойму почему но неправильно работает функция которая проверяет ответы на правильность.Там же я пробегаю по всем
<input></input>
а создание ответов это же не
<input></input>
Но могу предположить что в
answer[index] = rating
какбы засовываетса ище 2 rating так как ансверов стало уже 6?
Так вот скажите как зделать так что бы создавая текст ответов отдельно и добавляя его функция обработки правильных ответов работала правильно.И как зделать так что бы радиобаттоны создавались на одной линии с вопросом,а текст ответов над ними за рамкой?
Вот код
<?xml version="1.0" encoding="windows-1251"?>
<?xml-stylesheet href="style.css" type="text/css"?>
<!DOCTYPE test SYSTEM "test.xml">
<test>
<style border="5px solid black" hight="350px" width="350px" padding="20px" ></style>
<questions>
<question>Вопрос</question>
<answer rating="1"> Да</answer>
<answer rating="0"> Нет</answer>
<question1>Вопрос1</question1>
<answer rating="0"> Да</answer>
<answer rating="1"> Нет</answer>
</questions>
<TextButton>Ответить на вопрос</TextButton>
<TextButton>Стереть ответы</TextButton>
<ResultTextTrue>Ваш ответ верен!</ResultTextTrue>
<ResultTextFalse>Ваш ответ не верен!</ResultTextFalse>
</test>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<script type="text/javascript" src="jquery.js"></script>
<script src="script.js" type="text/javascript"></script>
<script type="text/javascript">
var answer={}
$(document).ready(function(){
$.ajax({
type: "GET",
url: "test.xml",
dataType: "xml",
success: vasa
});
function vasa(xml) {
answer=$(xml).find('answer')[0].textContent;
$('.cont1').append('<p><label><h4>'+answer+'</h4></label></p>');
answer=$(xml).find('answer')[1].textContent;
$('.cont1').append('<p><label><h4>'+answer+'</h4></label></p>');
question=$(xml).find('question')[0].textContent;
$('.cont1').append('<p><label><h4>'+question+'</h4></label></p>');
question1=$(xml).find('question1')[0].textContent;
$('.bond1').append('<p><label><h4>'+question1+'</h4></label></p>');
TextButton=$(xml).find('TextButton')[0].textContent;
$('.onki').append('<p><label><h4>'+TextButton+'</h4></label></p>');
TextButton=$(xml).find('TextButton')[1].textContent;
$('.lolki').append('<p><label><h4>'+TextButton+'</h4></label></p>');
ResultTextTrue=$(xml).find('ResultTextTrue')[0].textContent;
ResultTextFalse=$(xml).find('ResultTextFalse')[0].textContent;
var answers = $(xml).find('answer');
answers.each(function(index){
var a = this.textContent;
var rating = +this.getAttribute('rating');
var inputs = document.getElementsByTagName('input');
if(inputs.length<2)
{
$('.cont').append('<input name="group1" type="radio">');
}
else
{
$('.bond').append('<label><input name="group2" type="radio"></label>');
}
answer[index] = rating;
});
var div = document.getElementById('id')
var decoration = xml.querySelector('style');
div.style.border = decoration.getAttribute('border');
div.style.width = decoration.getAttribute('width');
div.style.height = decoration.getAttribute('hight');
div.style.padding = decoration.getAttribute('padding');
div.style.margin = decoration.getAttribute('margin');
}
});
function checkAnswer() {
var error = false;
var inputs = document.getElementsByTagName('input');
for(var i = 0; i < inputs.length ; i++){
var checked = inputs[i].checked;
var right = answer[i] == 1;
if (checked !== right){
error=true;
break;
}
}
output.value=error ? ''+ResultTextFalse+'' : ''+ResultTextTrue+'';
return false;
}
</script>
</head>
<body>
<form onsubmit="return checkAnswer()">
<div class="cont2"></div>
<div class="cont3"></div>
<div id="id">
<div class='cont1' ></div>
<div align="center" class='cont' ></div>
<div class="bond1"></div>
<div align="center" class='bond'></div>
</div>
<p><button type="submit"><div class='onki'></div></button> <button type="reset"><div class='lolki'></div></button></p>
<p><textarea id="output" readonly></textarea></p>
</form>
</body>
</html>
