Question

我是javascript的新手，所以请你好。我的网站上有一种quizz。我需要遍历选中的单选按钮，并在用户单击提交时添加值。

添加值后，必须出现一个小弹出窗口，显示结果。如果单选按钮的总值介于0-10显示消息1之间否则，如果单选按钮的总值介于11-20 diplay msg 2之间否则显示msg 3

我搜索了互联网，但我找不到一个简单的工作解释，说明如何循环播放单选按钮并累加总数

我的HTML表单看起来像这样

你多大了？
                     18-21
                     22-30
                     30-42
                     42个

                     你看起来像什么？
                     我看起来像泰国人                      我是一个典型的外国人（白皮肤，金发，蓝眼睛）
                     我是女孩                      我老了
                     您的资格等级
                     高中
                     大专文凭/证书
                     学士学位                      硕士学位或更好的

                  <strong>From which country are you?</strong><br />
                 <input type="radio" value="3" name="country" />Aus, NZ, SA, UK, US<br />
                 <input type="radio" value="0" name="country" />Other country from the once listed above<br />
                 <br />

                  <strong>Is English your naitive language</strong><br />
                 <input type="radio" value="2" name="country" />yes<br />
                 <input type="radio" value="0" name="country" />no<br />
                 <input type="radio" value="1" name="country" />no, but I am fluent<br />
                 <br />

                 <strong>Do you have any experience in teaching English in Thailand?</strong>
                 <br />
                 <input type="radio" value="0" name="experience" />none<br />
                 <input type="radio" value="1" name="experience" />0-1 year<br />
                 <input type="radio" value="3" name="experience" />1-2 years<br />
                 <input type="radio" value="4" name="experience" />2 years +<br />
                 <br />

                   <strong>What is your knowledge of Thai language and Thai culture</strong>
                 <br />
                 <input type="radio" value="1" name="culture" />I know nothing<br />
                 <input type="radio" value="2" name="culture" />I know my basics<br />
                 <input type="radio" value="3" name="culture" />I know slightly more than the basics<br />
                 <input type="radio" value="4" name="culture                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                \   " />My friends say I am Thai<br />
                 <br />

                    <strong>What is your knowledge of Thai language and Thai culture</strong>
                 <br />
                 <input type="radio" value="1" />I know nothing<br />
                 <input type="radio" value="2" />I know my basics<br />
                 <input type="radio" value="3" />I know slightly more than the basics<br />
                 <input type="radio" value="4" />My friends say I am Thai<br />
                 <br />

                    <strong>Do you have any visible tatoos or piercings?</strong>
                 <br />
                 <input type="radio" value="2" />Yes but it is not visible<br />
                 <input type="radio" value="4" />none<br />
                 <input type="radio" value="0" />Visible tatoo or piercing<br />
                 <br />

                 <strong>What gender are you</strong>
                 <br />
                 <input type="radio" value="1" />Male<br />
                 <input type="radio" value="4" />Female<br />
                 <br />
                 <input type="submit" onclick="showTotal" />


                 </form>

Answer 1

此帖子向您展示了如何获取单选按钮组的值：How can we access the value of a radio button using the DOM?

最简单的答案是：

function getRadioValue (theRadioGroup)
{
    for (var i = 0; i < document.getElementsByName(theRadioGroup).length; i++)
    {
        if (document.getElementsByName(theRadioGroup)[i].checked)
        {
                return document.getElementsByName(theRadioGroup)[i].value;
        }
    }
}

var country = parseInt(getRadioValue ('country'));
var experience = parseInt(getRadioValue ('experience'));

等。你需要将它们全部添加起来并提醒所有人

var total = country + experience; // add all the other variables here
alert(total);

希望有所帮助。

Answer 2

只需在您的主题部分添加以下脚本，然后您将获得总价值，如下所示。

<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script>
<script type="text/javascript">
function showTotal()
{
    total = 0;
    $("input[type=radio]:checked").each(function(){
        total += Number($(this).val());
    });
    alert(total);
}
</script>

循环通过单选按钮并添加总计javascript

2 个答案: