Pers.narod.ru. JavaScript. Простой тест с подсчётом отмеченных пунктов |
В газетах и Интернете очень распространены простые тесты, в которых нужно ответить "да" или "нет" на некоторые утверждения, а затем прочитать вывод, который зависит от числа отмеченных утверждений. Как правило, за каждый положительный ответ начисляется 1 балл. Сначала приведём пример подобного теста в работе.
Тест "Я И АЛКОГОЛЬ". За каждый положительный ответ начисляется 1 балл. Постарайтесь честно ответить на следующие вопросы:
Поставьте "галочки" рядом с утверждениями, с которыми Вы согласны (нужен включённый Javascript)
Теперь о реализации на Javascript. Весь тест состоит только из одного тега скрипта и составляется за несколько элементарных шагов.
1. Сначала опишем все вопросы теста в одном массиве:
<script type="text/javascript"> var q=new Array ( 'После ссоры в семье, после выговора начальника ищете ли Вы успокоение в спиртных напитках?', 'Замечаете ли Вы, что стали в последнее время пить больше?', 'Случалось ли Вам, проснувшись утром после выпивки, не помнить, что было вчера?', 'Когда пьете в компании, не стараетесь ли Вы незаметно выпить побольше?', 'Случались ли в вашей жизни ситуации, когда без алкоголя Вы чувствовали себя неуверенно?', 'Стремитесь ли Вы опорожнить первую рюмку быстрее, чем делали это раньше?', 'Приходите ли Вы в негодование, когда близкие осуждают ваши выпивки?', 'Замечаете ли Вы у себя провалы памяти?', 'Всегда ли у Вас находятся причины, оправдывающие выпивку?', 'Часто ли Вы жалеете о том, что сделали или сказали в пьяном виде?', 'Возникает ли у Вас желание контролировать количество потребляемых спиртных напитков?', 'Часто ли Вы нарушаете данное себе обещание - пить меньше или вообще бросить пить?', 'Пытались ли Вы бросить пить?', 'Стремитесь ли Вы к тому, чтобы ваша семья и друзья не видели Вас пьяным?', 'Замечали ли Вы, что из-за потребления спиртного у Вас появились финансовые затруднения и проблемы на работе?', 'Увеличилось ли число людей, которые, как Вам кажется, несправедливо к Вам относятся?', 'Дрожат ли у Вас руки даже после небольшой выпивки?', 'Бывает ли, что Ваш запой длится несколько дней?', 'Чувствуете ли Вы иногда депрессию и нежелание жить?', 'Бывают ли у Вас после пьянки слуховые и зрительные галлюцинации?' );
2. Теперь запишем варианты вывода (r
) и баллы, при которых они выводятся (balls
). В массиве balls
столько же элементов, сколько в r
, при этом каждый элемент balls[i]
показывает количество положительных ответов, до которого включительно действителен вывод r[i]
:
var r = new Array ( 'У Вас нет проблем с алкоголем', 'Вероятно, у Вас ранняя стадия алкголизма, которая длится обычно 10-15 лет', 'Вероятно, у Вас средняя стадия алкголизма, она длится обычно 2-5 лет', 'У вас - последняя стадия алкоголизма, это неизлечимо' ); var balls = new Array (0,7,17,20);
Как видно, первый вывод ("У Вас нет проблем с алкоголем") будет сделан только при нуле баллов, второй - при количестве баллов от 1 до 7, третий - от 8 до 17 включительно, последний - при количестве отмеченных ответов от 18 до 20.
Формирование теста займёт всего несколько строк на Javascript:
document.writeln ('<form name="f1" action="" method="post">'+ '<table width="90%" align="center" border="0" cellpadding="4" cellspacing="0">' ); for (var i=0; i<q.length; i++) document.writeln ('<tr><td align="center"><input type="checkbox" name="r'+ i+'" value="1"></td><td>'+(i+1)+'. '+q[i]+'</td></tr>'); document.writeln ( '<tr><td align="center"><input type="button" value="ОК" onclick="results();"></td></tr>'+ '</table></form>'); </script></div>
3. Осталось вставить перед этим кодом служебные функции,на которые есть ссылки из текста. Функция get_word_form
просто будет правильно склонять слово, ненавижу, когда пишут "Вы набрали 21 баллов":
function get_word_form (n,word,o1,o2,o5) { if (n%100>10 && n%100<20 || n%10==0 || n%10>4) word+=o5; else if (n%10>1 && n%10<5) word+=o2; else word+=o1; return word; }
Функция find_balls (n)
найдёт по набранному юзером количеству баллов n
номер требуемого вывода (номер элемента в массиве r
), а также покажет сообщение об ошибке, если информации не найдено:
function find_balls (n) { for (var i=0; i<balls.length; i++) if (n<=balls[i]) return r[i]; return 'Не найдено результатов для количества баллов '+n+'. Обратитесь к разработчикам теста'; }
Функция results()
выведет набранное количество баллов и вывод-результат в тот раздел документа, где были вопросы теста... ну ладно, ещё ссылку "Обновить" в ней сделаем:
function results () { var n=0; for (var i=0; i<q.length; i++) { var e1 = eval('document.f1.r'+i+'.checked'); if (e1) n++; } document.getElementById("test_div").innerHTML = '<table width="90%" align="center" border="0" cellpadding="4" cellspacing="0"><tr><td align="center">\n'+ '<p>Вы отметили '+n+' '+get_word_form (n,'пункт','','а','ов') +' из '+q.length+'.<br>\n'+ find_balls(n)+'<br>\n'+ '<a href="#" onclick="location.replace(location.href);return false">Обновить</a>'+ '</td></tr></table>'; return false; }
В принципе, это всё, получился простой и удобный тест-опросник на Javascript.
гостевая; E-mail |