1

調査用のWebサイトを開発していますが、残りの質問の数をユーザーに示したいと思います。

質問は動的であるため、データベースから質問の総数を読み取ってカウンターに表示します。

次に、ユーザーが質問に回答するたびに（ユーザーはラジオボタングループから回答を選択します）、カウンターを1つ減らします。

ユーザーがラジオボタンをクリックするたびに呼び出される関数があり、うまく機能します。しかし、私はカウンターを表す方法がわかりませんか？画面にカウンターを表示する方法は？そして、その関数にどのような値を渡す必要がありますか？カウンターを視覚的に見栄えよく表示できれば、ユーザーが上下にスクロールしてもカウンターが常に表示されるようにすることも役立ちます。

各質問は一意です：

<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";
}
4

1 に答える 1

4

次のことを試してください。

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)
})

デモ

于 2012-07-23T05:25:36.547 に答える