一个10道题的心理测试网页代码

以下是一个简单的心理测试网页代码,包含了10道心理测试题目:

<!DOCTYPE html>
<html>
<head>
    <title>心理测试</title>
</head>
<body>
    <h1>心理测试</h1>

    <form id="quiz" name="quiz">
        <ol>
            <li>
                <h3>你认为自己是一个乐观的人吗?</h3>

                <div>
                    <input type="radio" name="q1" value="a" id="q1a">
                    <label for="q1a">A. 是的,我很乐观。</label>
                </div>

                <div>
                    <input type="radio" name="q1" value="b" id="q1b">
                    <label for="q1b">B. 我有时会感到沮丧,但我尽力保持乐观。</label>
                </div>

                <div>
                    <input type="radio" name="q1" value="c" id="q1c">
                    <label for="q1c">C. 不,我通常都很消极。</label>
                </div>

            </li>

            <li>
                <h3>你喜欢与人交流吗?</h3>

                <div>
                    <input type="radio" name="q2" value="a" id="q2a">
                    <label for="q2a">A. 是的,我很喜欢和不同的人交流。</label>
                </div>

                <div>
                    <input type="radio" name="q2" value="b" id="q2b">
                    <label for="q2b">B. 有时我很喜欢和人交流,但有时我需要安静。</label>
                </div>

                <div>
                    <input type="radio" name="q2" value="c" id="q2c">
                    <label for="q2c">C. 不,我宁愿一个人呆着。</label>
                </div>

            </li>

            <li>
                <h3>你现在是否感到有压力?</h3>

                <div>
                    <input type="radio" name="q3" value="a" id="q3a">
                    <label for="q3a">A. 不,我现在很放松。</label>
                </div>

                <div>
                    <input type="radio" name="q3" value="b" id="q3b">
                    <label for="q3b">B. 有点,但我可以应对。</label>
                </div>

                <div>
                    <input type="radio" name="q3" value="c" id="q3c">
                    <label for="q3c">C. 是的,我感到非常有压力。</label>
                </div>

            </li>

            <li>
                <h3>你认为自己是一个容易相处的人吗?</h3>

                <div>
                    <input type="radio" name="q4" value="a" id="q4a">
                    <label for= "q4a">A. 是的,我很容易相处。</label>
                </div>

                <div>
                    <input type="radio" name="q4" value="b" id="q4b">
                    <label for="q4b">B. 有时我很容易相处,但有时我会有些固执。</label>
                </div>

                <div>
                    <input type="radio" name="q4" value="c" id="q4c">
                    <label for= "q4c">C. 不,我不太容易相处。</label>
                </div>

            </li>

            <li>
                <h3>你认为人生的意义是什么?</h3>

                <div>
                    <input type="radio" name="q5" value="a" id="q5a">
                    <label for= "q5a">A. 为了追求个人幸福。</label>
                </div>

                <div>
                    <input type="radio" name="q5" value="b" id="q5b">
                    <label for= "q5b">B. 为了帮助他人和社会。</label>
                </div>

                <div>
                    <input type="radio" name="q5" value= "c"id= "q5c">
                    <label for= "q5c">C. 我不知道人生的意义是什么。</label>
                </div>

            </li>

            <li>
                <h3>你是否在寻找爱情或者寻找恋爱关系?</h3>

                <div>
                    <input type="radio" name="q6" value="a" id="q6a">
                    <label for= "q6a">A. 是的,我在寻找恋爱关系。</label>
                </div>

                <div>
                    <input type="radio" name="q6" value="b" id="q6b">
                    <label for= "q6b">B. 不,我目前不在寻找恋爱关系。</label>
                </div>

            </li>

            <li>
                <h3>你是否觉得自己与周围人格格不入?</h3>

                <div>
                    <input type="radio" name="q7" value="a" id="q7a">
                    <label for= "q7a">A. 不,我觉得我和周围的人很合拍。</label>
                </div>

                <div>
                    <input type="radio" name="q7" value="b" id="q7b">
                    <label for= "q7b">B. 有时我会感到自己与周围的人格格不入。</label>
                </div>

                <div>
                    <input type="radio" name="q7" value= "c"id= "q7c">
                    <label for= "q7c">C. 是的,我觉得自己与周围的人格格不入。</label>
                </div>

            </li>


            <li>
                <h3>你通常会选择什么类型的活动?</h3>

                <div>
                    <input type="radio" name="q8" value="a" id="q8a">
                    <label for= "q8a">A. 社交、运动和冒险类活动。</label>
                </div>

                <div>
                    <input type="radio" name="q8" value="b" id="q8b">
                    <label for= "q8b">B. 阅读、绘画和听音乐类活动。</label>
                </div>

                <div>
                    <input type="radio" name="q8" value= "c"id= "q8c">
                    <label for= "q8c">C. 我选择不同类型的活动。</label>
                </div>

            </li>

            <li>
                <h3>你是否担心自己的身体健康?</h3>

                <div>
                    <input type="radio" name="q9" value="a" id="q9a">
                    <label for= "q9a">A. 不,我对自己的身体感到很满意。</label>
                </div>

                <div>
                    <input type="radio" name="q9" value="b" id="q9b">
                    <label for= "q9b">B. 有时我会担心我的身体健康。</label>
                </div>

                <div>
                    <input type="radio" name = "q9"value= "c"id ="10c">
                     <label for= "10c">C. 是的,我非常担心我的身体健康。</label>
                </div>

            </li>


            <li>
                <h3>你现在的情绪状态是什么?</h3>

                <div>
                    <input type="radio" name="q10" value="a" id="q10a">
                    <label for= "q10a">A. 我现在情绪很好。</label>
                </div>

                <div>
                    <input type="radio" name="q10" value="b" id="q10b">
                    <label for= "q10b">B. 我现在情绪比较低落。</label>
                </div>

                <div>
                    <input type="radio" name= "q10"value= "c"id ="q10c">
                     <label for= "q10c">C. 我现在情绪很复杂,难以描述。</label>
                </div>

            </li>


            

            
        </ol>


        <input type="submit" value="提交答案">

    </form>

    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script src="./quiz.js"></script>

</body>
</html>

这里使用了一个简单的表单来收集用户的答案,其中每个问题都有三个选项。在提交表单之后,可以使用 JavaScript 来计算用户的得分并显示测试结果。您需要将“quiz.js”替换为包含计算用户得分和生成测试结果的 JavaScript 文件。

版权声明:
作者:wangluo
链接:http://codeftp.com/?p=242
来源:源码分享网
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
< <上一篇
下一篇>>