使用Javascript或jQuery計數器

我正在開發一個調查網站，並且我想向用戶顯示需要回答的問題數量。使用Javascript或jQuery計數器

由於問題是動態的，因此我從數據庫中讀取了要在櫃檯顯示的問題總數。

然後用戶每次回答一個問題（用戶選擇從單選按鈕組答案）我會通過一個等遞減計數器。

我有這樣的功能，只要用戶點擊一個單選按鈕，它就可以很好地工作。但我不知道如何代表櫃檯？以及如何在屏幕上顯示計數器？我應該傳遞給那個函數什麼值？如果我們能夠以一種很好的視覺方式顯示計數器，那麼即使用戶向上或向下滾動，計數器也應始終可見，這也會有所幫助。

每一個問題是在一個獨特的：

<div id="Q1">What is your gender? 
<input type='radio' name='RQ1' value='Male' onClick="RadioClicked(Q1)" /> 
<input type='radio' name='RQ1' value='Female' onClick="RadioClicked(Q1)" /> 
</div>

這裏是JavaScript的功能，例如我改變背景顏色，以確保功能的作品，但在這個函數中，我應該遞減計數器：

function RadioClicked(Question){ 
     document.getElementById(Question).style.backgroundColor = "Gray"; 
}

來源

2012-07-23 user1483799

嘗試以下操作：

var q = $('div[id^="Q"]').length // number of questions 
$('input[type=radio]').change(function(){ 
    $(this).parent().css('background-color', 'Gray'); 
    var remained = q - $('input[type=radio]:checked').length // number of unanswered questions 
    $('#remaining').text(remained) 
})

DEMO

來源

2012-07-23 05:25:36 undefined

謝謝，它的工作原理。你有沒有想法如何以一種漂亮的方式顯示計數器，就像在屏幕上流動的盒子一樣，即使用戶向上或向下滾動，它仍然可見？ – user1483799 2012-07-23 05:35:24

@ user1483799不用客氣，可以使用css'position：fixed' – undefined 2012-07-23 05:36:13

太好了，謝謝！ – user1483799 2012-07-23 05:50:44

使用Javascript或jQuery計數器

回答

相關問題