我想要做這個網頁的線上績分題
http://www.2h.com.tw/event/20150409/index.html?a=1538
它的js：http://www.2h.com.tw/event/20150409/js/script.js
可是我實在看不是很懂它在寫什麼
<div class="q_block" id="q1">
<h3>Part 1.您頭皮的症狀？</h3>
<div class="checkall">
<span style="visibility:hidden;">Part 1.</span>
<input type="checkbox" class="checkbox" name="q1" id="q1_1" />
掉髮多或頭皮油膩的問題<br />
<span style="visibility:hidden;">Part 1.</span>
<input type="checkbox" class="checkbox" name="q1" id="q1_2" />
長痘痘<br />
<span style="visibility:hidden;">Part 1.</span>
<input type="checkbox" class="checkbox" name="q1" id="q1_3" />
容易紅腫、癢<br />
<span style="visibility:hidden;">Part 1.</span>
<input type="checkbox" class="checkbox" name="q1" id="q1_4" />
易有頭皮屑</div>
<div class="q_button" onClick="next();">下 一 題</div>
=============================================================================
var q_idx = 1;
function next(){
if(q_idx == 1){
var score = 0;
for(var i = 1 ; i <= 1 ; i++){
for(var j = 1 ; j <= 2; j++){
if(document.getElementById('q' + i + '_' + j).checked) score++;
}
}
document.getElementById('score1').innerHTML = score;
document.getElementById('BannerAll').style.display = 'none';
document.getElementById('Address').style.display = 'none';
}
==============================================================================
上面這個應該是 next()跑到下一題的函式
跑到下一題後把有 BannerAll和Address id屬性的tag消掉
這邊的i和j應該為input的id q1_1~4 設的迴圈
每勾一個得一分嗎？不太懂它分數是怎麼算..
另外分數(變數score)會顯示在上面具有id=scorel的tag
您的頭皮總合分析 <span id="score1">0</span> 分
但是這個ans區域是到後來才顯示，前面幾題作答沒有出來@_@
==============================================================================
if(q_idx == 3){
var score = 0;
for(var i = 1 ; i <= 3; i++){
for(var j = 1 ; j <= 4; j++){
if(document.getElementById('q' + i + '_' + j).checked) score++;
}
}
document.getElementById('score1').innerHTML = score;
document.getElementById('subtitle').style.display = 'none';
document.getElementById('main01').style.display = 'none';
document.getElementById('doctors').style.display = 'none';
document.getElementById('doctor_intro').style.display = 'none';
document.getElementById('ans1').style.display = 'block';
}
=============================================================================
q_idx這個變數在之前有設定值為１，我不太懂它是要幹麻的
可是這邊卻說它變３的話要讓分數歸零
但之前q_idx就是１，它哪會變成３呢？
這邊讓蠻多id屬性消失，變成id=ans1的跑出來
我看網頁它是進行到第四題的時候id=ans1會跑出來
=============================================================================
if(q_idx == 5){
var score2 = 0;
for(var j = 1 ; j <= 4; j++){
if(document.getElementById('q4' + '_' + j).checked) score2++;
}
document.getElementById('score2').innerHTML = score2;
var score3 = 0;
for(var j = 1 ; j <= 4; j++){
if(document.getElementById('q5' + '_' + j).checked) score3++;
}
document.getElementById('score3').innerHTML = score3;
document.getElementById('q' + q_idx).style.display = 'none';
document.getElementById('ans1').style.display = 'none';
document.getElementById('ans2').style.display = 'block';
//document.getElementById('ans_spacing2').style.height= '75px';
document.getElementById('form_block').style.display = 'block';
}else{
var no_ans_flg = true;
for(var j = 1 ; j <= 4; j++){
if(document.getElementById('q' + q_idx + '_' + j).checked) {
no_ans_flg = false;
break;
}
}
if(no_ans_flg){
alert('xxxxxxxxxxxx
================================================================================
推測這邊是進行到第四題 然後q_idx==5 還是不太懂是什麼@@
我看了一下它的題目總共有五題
而上面為何又要多出score2 score3變數也不太懂
跟著它的 no_ans_flg 應該是指假如使用者沒有作答嗎？
後來會跳出來的頁面是收集用戶資料頁 id="form_block"的div
也是上述程式中讓它出現的
===============================================================================
對這段code真的是一知半解的 不知道該怎麼看懂才好
新手入門 還請大家多多指點迷津 感激感激 m(__ __)m
另外不知道有沒有其它比較好懂的程式碼可以參考呢?
我google了一大堆 可是沒有找到我要的這種
(checkbox 積分制)_
試過的google key word:
javascript checkbox multiple selection score
Multiple Choice Quiz Javascript
Multiple Choice Questionnaire
JAVASCRIPT Multiple Choice checkbox
javascript calculate total checkbox
How to Create a Scored Survey