{"id":2582,"date":"2023-10-17T09:45:02","date_gmt":"2023-10-17T01:45:02","guid":{"rendered":"https:\/\/bookmark.tw\/?p=2582"},"modified":"2025-08-17T00:58:17","modified_gmt":"2025-08-16T16:58:17","slug":"emotional-injury-rate","status":"publish","type":"post","link":"https:\/\/xinliceyan.org\/zh\/emotional-injury-rate","title":{"rendered":"\u5c0f\u6d4b\u9a8c\uff1a\u4e0b\u4e00\u6bb5\u611f\u60c5\u91cc\u4f60\u7684\u300c\u53d7\u4f24\u7387\u300d\u6709\u591a\u9ad8\uff1f"},"content":{"rendered":"<link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/bootstrap\/5.3.3\/css\/bootstrap.min.css\" rel=\"stylesheet\">\n    <link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/bootstrap-icons\/1.11.3\/font\/bootstrap-icons.min.css\" rel=\"stylesheet\">\n    <style>\n        \/* \u81ea\u5b9a\u7fa9\u6a23\u5f0f - \u9075\u5faa8px\u7db2\u683c\u7cfb\u7d71 *\/\n        .quiz-container-9 {\n            font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n            line-height: 1.6;\n            color: #2c3e50;\n            min-height: 100vh;\n            padding: 16px;\n        }\n        \n        .quiz-container-9 h2 {\n            font-size: 32px;\n            font-weight: 700;\n            color: #34495e;\n            margin-bottom: 24px;\n        }\n        \n        .quiz-container-9 h3 {\n            font-size: 22px;\n            font-weight: 700;\n            color: #34495e;\n            margin-bottom: 24px;\n        }\n        \n        \/* \u5f15\u5c0e\u9801\u6a23\u5f0f *\/\n        #quizintro9 {\n            animation: fadeIn 0.6s ease-in;\n        }\n        \n        .intro-icon-9 {\n            width: 80px;\n            height: 80px;\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n            border-radius: 50%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            margin: 0 auto 16px;\n            box-shadow: 0 8px 24px rgba(102, 126, 234, 0.3);\n            transition: transform 0.3s ease;\n        }\n        \n        .intro-icon-9:hover {\n            transform: translateY(-4px);\n        }\n        \n        .intro-icon-9 i {\n            font-size: 40px;\n            color: white;\n        }\n        \n        .feature-card-9 {\n            background: white;\n            border-radius: 16px;\n            padding: 24px;\n            box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n            transition: all 0.3s ease;\n            height: 100%;\n        }\n        \n        .feature-card-9:hover {\n            transform: translateY(-4px);\n            box-shadow: 0 8px 24px rgba(0,0,0,0.12);\n        }\n        \n        .feature-icon-9 {\n            width: 56px;\n            height: 56px;\n            background: linear-gradient(135deg, #a8e6cf 0%, #dcedc1 100%);\n            border-radius: 50%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            margin-bottom: 16px;\n        }\n        \n        .feature-icon-9 i {\n            font-size: 24px;\n            color: #27ae60;\n        }\n        \n        .start-btn-9 {\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n            color: white;\n            font-size: 20px;\n            font-weight: 600;\n            padding: 16px 48px;\n            border: none;\n            border-radius: 32px;\n            box-shadow: 0 8px 24px rgba(102, 126, 234, 0.3);\n            transition: all 0.3s ease;\n            min-width: 200px;\n        }\n        \n        .start-btn-9:hover {\n            transform: translateY(-2px);\n            box-shadow: 0 12px 32px rgba(102, 126, 234, 0.4);\n            background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 100%);\n            color: white;\n        }\n        \n        \/* \u6e2c\u9a57\u9801\u6a23\u5f0f *\/\n        #quizmain9 {\n            display: none;\n        }\n        \n        .option-btn-9 {\n            width: 100%;\n            text-align: left;\n            padding: 20px 24px;\n            margin-bottom: 16px;\n            background: white;\n            border: 2px solid #e8f4f8;\n            border-radius: 12px;\n            font-size: 18px;\n            color: #2c3e50;\n            transition: all 0.3s ease;\n            box-shadow: 0 2px 8px rgba(0,0,0,0.05);\n            min-height: 64px;\n            display: flex;\n            align-items: center;\n        }\n        \n        .option-btn-9:hover {\n            background: linear-gradient(135deg, #f0f9ff 0%, #e8f4f8 100%);\n            border-color: #667eea;\n            transform: translateX(4px);\n            box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);\n            color: #2c3e50;\n        }\n        \n        .option-btn-9.selected {\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n            color: white;\n            border-color: #667eea;\n        }\n        \n        .prev-btn-9 {\n            background: #95a5a6;\n            color: white;\n            font-size: 16px;\n            padding: 12px 32px;\n            border: none;\n            border-radius: 24px;\n            transition: all 0.3s ease;\n            display: none;\n        }\n        \n        .prev-btn-9:hover {\n            background: #7f8c8d;\n            color: white;\n        }\n        \n        \/* \u7d50\u679c\u9801\u6a23\u5f0f *\/\n        #quizresult9 {\n            display: none;\n        }\n        \n        .result-card-9 {\n            background: white;\n            border-radius: 20px;\n            padding: 32px;\n            box-shadow: 0 8px 32px rgba(0,0,0,0.1);\n            margin-bottom: 24px;\n        }\n        \n        .damage-level-9 {\n            font-size: 48px;\n            font-weight: 700;\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n            -webkit-background-clip: text;\n            -webkit-text-fill-color: transparent;\n            background-clip: text;\n            margin-bottom: 16px;\n        }\n        \n        .restart-btn-9 {\n            background: linear-gradient(135deg, #a8e6cf 0%, #dcedc1 100%);\n            color: #27ae60;\n            font-size: 18px;\n            font-weight: 600;\n            padding: 14px 40px;\n            border: none;\n            border-radius: 28px;\n            box-shadow: 0 6px 20px rgba(168, 230, 207, 0.3);\n            transition: all 0.3s ease;\n        }\n        \n        .restart-btn-9:hover {\n            transform: translateY(-2px);\n            box-shadow: 0 8px 24px rgba(168, 230, 207, 0.4);\n            color: #27ae60;\n        }\n        \n        .chart-container-9 {\n            position: relative;\n            height: 300px;\n            width: 100%;\n            max-width: 500px;\n            margin: 32px auto;\n        }\n        \n        @keyframes fadeIn {\n            from { opacity: 0; transform: translateY(20px); }\n            to { opacity: 1; transform: translateY(0); }\n        }\n        \n        \/* \u97ff\u61c9\u5f0f\u8a2d\u8a08 *\/\n        @media (max-width: 768px) {\n            .quiz-container-9 h2 {\n                font-size: 28px;\n            }\n            \n            .start-btn-9 {\n                font-size: 18px;\n                padding: 14px 40px;\n            }\n            \n            .option-btn-9 {\n                font-size: 16px;\n                padding: 16px 20px;\n            }\n            \n            .damage-level-9 {\n                font-size: 36px;\n            }\n        }\n    <\/style>\n    <div class=\"quiz-container-9\">\n        <!-- \u5f15\u5c0e\u9801 -->\n        <section id=\"quizintro9\" data-page=\"intro9\">\n            <div class=\"container\">\n                <div class=\"row justify-content-center\">\n                    <div class=\"col-lg-8\">\n                        <div class=\"text-center mb-5\">\n                            <div class=\"intro-icon-9\">\n                                <i class=\"bi bi-heart-pulse-fill\"><\/i>\n                            <\/div>\n                            <h2>\u4e0b\u4e00\u6bb5\u611f\u60c5\u88e1\u4f60\u7684\u300c\u53d7\u50b7\u7387\u300d\u6709\u591a\u9ad8\uff1f<\/h2>\n                            <p class=\"lead text-muted mb-4\">\n                                \u66fe\u7d93\u7684\u4f60\uff0c\u56e0\u70ba\u559c\u6b61\u6240\u4ee5\u4e0d\u9867\u4e00\u5207\u3002\u4f46\u5728\u7d93\u6b77\u4e00\u6b21\u6b21\u7684\u50b7\u5bb3\u5f8c\uff0c\u4f60\u6703\u96e3\u904e\uff0c\u4e5f\u6703\u5bb3\u6015\u3002\n                                \u6f38\u6f38\u5730\uff0c\u54ea\u6015\u4f60\u5c0d\u611b\u60c5\u5fc3\u61f7\u61a7\u61ac\uff0c\u537b\u5df2\u4e0d\u6562\u8f15\u6613\u6295\u5165\u5230\u611f\u60c5\u4e2d\u3002\n                            <\/p>\n                        <\/div>\n                        \n                        <div class=\"row g-4 mb-5\">\n                            <div class=\"col-md-4\">\n                                <div class=\"feature-card-9\">\n                                    <div class=\"feature-icon-9\">\n                                        <i class=\"bi bi-lightbulb\"><\/i>\n                                    <\/div>\n                                    <h5 class=\"mb-2\">\u6df1\u5ea6\u6d1e\u5bdf<\/h5>\n                                    <p class=\"text-muted small\">\u900f\u904e\u7c21\u55ae\u7684\u9078\u64c7\uff0c\u6d1e\u5bdf\u4f60\u5728\u611f\u60c5\u4e2d\u7684\u6f5b\u5728\u98a8\u96aa<\/p>\n                                <\/div>\n                            <\/div>\n                            <div class=\"col-md-4\">\n                                <div class=\"feature-card-9\">\n                                    <div class=\"feature-icon-9\">\n                                        <i class=\"bi bi-shield-check\"><\/i>\n                                    <\/div>\n                                    <h5 class=\"mb-2\">\u4e13\u4e1a\u5206\u6790<\/h5>\n                                    <p class=\"text-muted small\">\u57fa\u65bc\u5fc3\u7406\u5b78\u539f\u7406\uff0c\u63d0\u4f9b\u7cbe\u6e96\u7684\u500b\u6027\u5316\u7d50\u679c<\/p>\n                                <\/div>\n                            <\/div>\n                            <div class=\"col-md-4\">\n                                <div class=\"feature-card-9\">\n                                    <div class=\"feature-icon-9\">\n                                        <i class=\"bi bi-graph-up\"><\/i>\n                                    <\/div>\n                                    <h5 class=\"mb-2\">\u89c6\u89c9\u5316\u7ed3\u679c<\/h5>\n                                    <p class=\"text-muted small\">\u76f4\u89c0\u7684\u5716\u8868\u5c55\u793a\uff0c\u8b93\u4f60\u66f4\u4e86\u89e3\u81ea\u5df1\u7684\u611f\u60c5\u6a21\u5f0f<\/p>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        \n                        <div class=\"text-center\">\n                            <button class=\"btn start-btn-9\" onclick=\"quizApp9.startQuiz()\">\n                                \u5f00\u59cb\u6d4b\u9a8c <i class=\"bi bi-arrow-right-circle ms-2\"><\/i>\n                            <\/button>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n        \n        <!-- \u6e2c\u9a57\u9801 -->\n        <section id=\"quizmain9\" data-page=\"quiz9\">\n            <div class=\"container\">\n                <div class=\"row justify-content-center\">\n                    <div class=\"col-lg-6\">\n                        <div class=\"text-center mb-4\">\n                            <h2>\u611f\u60c5\u53d7\u50b7\u7387\u6e2c\u9a57<\/h2>\n                        <\/div>\n                        \n                        <div class=\"result-card-9\">\n                            <h3 class=\"mb-4\">\u8ddf\u670b\u53cb\u53bb\u5403\u706b\u934b\u6642\uff0c\u4f60\u4e00\u822c\u6703\u9078\u64c7\u4ec0\u9ebc\u914d\u83dc\uff1f<\/h3>\n                            \n                            <div class=\"options-container\">\n                                <button class=\"btn option-btn-9\" data-option=\"A\" onclick=\"quizApp9.selectOption('A')\">\n                                    <span>A. \u83c7\u985e\u548c\u6d77\u9bae\u985e<\/span>\n                                <\/button>\n                                <button class=\"btn option-btn-9\" data-option=\"B\" onclick=\"quizApp9.selectOption('B')\">\n                                    <span>B. \u9d28\u8840\u548c\u5167\u81df\u985e<\/span>\n                                <\/button>\n                                <button class=\"btn option-btn-9\" data-option=\"C\" onclick=\"quizApp9.selectOption('C')\">\n                                    <span>C. \u8c46\u8150\u548c\u9752\u83dc<\/span>\n                                <\/button>\n                                <button class=\"btn option-btn-9\" data-option=\"D\" onclick=\"quizApp9.selectOption('D')\">\n                                    <span>D. \u5404\u7a2e\u8089\u985e<\/span>\n                                <\/button>\n                            <\/div>\n                            \n                            <div class=\"text-center mt-4\">\n                                <button class=\"btn prev-btn-9\" onclick=\"quizApp9.goBack()\">\n                                    <i class=\"bi bi-arrow-left me-2\"><\/i>\u4e0a\u4e00\u9898\n                                <\/button>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n        \n        <!-- \u7d50\u679c\u9801 -->\n        <section id=\"quizresult9\" data-page=\"result9\">\n            <div class=\"container\">\n                <div class=\"row justify-content-center\">\n                    <div class=\"col-lg-8\">\n                        <div class=\"text-center mb-4\">\n                            <h2>\u6d4b\u9a8c\u7ed3\u679c\u5206\u6790<\/h2>\n                        <\/div>\n                        \n                        <div class=\"result-card-9\">\n                            <div class=\"text-center\">\n                                <p class=\"text-muted mb-2\">\u4f60\u7684\u611f\u60c5\u53d7\u50b7\u7387\u70ba<\/p>\n                                <div class=\"damage-level-9\" id=\"damageRate9\">80%<\/div>\n                            <\/div>\n                            \n                            <div class=\"chart-container-9\">\n                                <canvas id=\"resultChart9\"><\/canvas>\n                            <\/div>\n                            \n                            <div id=\"resultDescription9\" class=\"mt-4\">\n                                <h4 class=\"mb-3\">\u8be6\u7ec6\u5206\u6790<\/h4>\n                                <p>\u6e2c\u9a57\u7d50\u679c\u5206\u6790\u5167\u5bb9&#8230;<\/p>\n                            <\/div>\n                        <\/div>\n                        \n                        <div class=\"text-center mt-4\">\n                            <button class=\"btn restart-btn-9\" onclick=\"quizApp9.restart()\">\n                                <i class=\"bi bi-arrow-clockwise me-2\"><\/i>\u91cd\u65b0\u6d4b\u9a8c\n                            <\/button>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n    <\/div>\n    \n    <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/Chart.js\/4.4.1\/chart.umd.min.js\"><\/script>\n    <script>\n        \/\/ \u4f7f\u7528IIFE\u5c01\u88dd\u4ee3\u78bc\uff0c\u907f\u514d\u5168\u5c40\u8b8a\u91cf\u6c61\u67d3\n        const quizApp9 = (function() {\n            'use strict';\n            \n            \/\/ \u6e2c\u9a57\u6578\u64da\n            const quizData = {\n                A: {\n                    rate: 80,\n                    description: '\u5728\u4e0b\u4e00\u6bb5\u611f\u60c5\u88e1\u4f60\u7684\u53d7\u50b7\u7387\u70ba80%\u3002\u5728\u8ac7\u6200\u611b\u7684\u6642\u5019\uff0c\u4f60\u662f\u4e0d\u80fd\u638c\u63e1\u597d\u5206\u5bf8\u611f\u7684\uff0c\u54ea\u6015\u559c\u6b61\u4f60\u7684\u4eba\u5f88\u4ecb\u610f\u4f60\u8207\u5176\u4ed6\u7570\u6027\u4ea4\u5f80\u904e\u5bc6\uff0c\u4f60\u9084\u662f\u4e0d\u6703\u548c\u5176\u4ed6\u4eba\u4fdd\u6301\u8ddd\u96e2\u3002\u5982\u679c\u559c\u6b61\u7684\u4eba\u4e5f\u61f7\u7591\u9019\u61f7\u7591\u90a3\uff0c\u4f60\u6703\u52d5\u4e0d\u52d5\u5c31\u751f\u6c23\u3002\u6f38\u6f38\u5730\uff0c\u5169\u4eba\u4e4b\u9593\u7684\u611f\u60c5\u4e0d\u4f46\u4e0d\u6703\u4e00\u6b65\u4e00\u6b65\u5347\u6eab\uff0c\u53cd\u800c\u6703\u4e00\u6b65\u6b65\u5730\u88ab\u4f60\u7d66\u4f5c\u6c92\u3002\u5efa\u8b70\u4f60\u5728\u611f\u60c5\u4e2d\u591a\u4e00\u4e9b\u7406\u89e3\u548c\u5c0a\u91cd\uff0c\u5b78\u6703\u63db\u4f4d\u601d\u8003\u3002'\n                },\n                B: {\n                    rate: 90,\n                    description: '\u5c0d\u5f85\u611f\u60c5\uff0c\u4f60\u662f\u6ce8\u91cd\u7d30\u7bc0\u4e14\u6bd4\u8f03\u6311\u5254\u7684\u3002\u4f60\u5e0c\u671b\u559c\u6b61\u7684\u90a3\u500b\u4eba\u5404\u65b9\u9762\u90fd\u662f\u5b8c\u7f8e\u7684\uff0c\u660e\u77e5\u5c0d\u65b9\u6df1\u611b\u8457\u4f60\uff0c\u4f60\u9084\u662f\u6703\u5c0d\u559c\u6b61\u7684\u4eba\u63d0\u51fa\u8af8\u591a\u8981\u6c42\uff0c\u800c\u4e14\u4e0d\u9858\u655e\u958b\u5fc3\u6249\u53bb\u63a5\u7d0d\u5c0d\u65b9\u3002\u5728\u9019\u7a2e\u58d3\u529b\u611f\u4e0b\uff0cTA\u5c31\u6703\u96e2\u958b\u4f60\u3002\u5728\u4e0b\u4e00\u6bb5\u611f\u60c5\u88e1\uff0c\u5982\u679c\u4f60\u548c\u4e4b\u524d\u4e00\u822c\uff0c\u4f60\u7684\u53d7\u50b7\u7387\u6703\u9ad8\u905490%\u3002\u5efa\u8b70\u4f60\u5b78\u6703\u63a5\u7d0d\u4e0d\u5b8c\u7f8e\uff0c\u73cd\u60dc\u773c\u524d\u4eba\u3002'\n                },\n                C: {\n                    rate: 10,\n                    description: '\u5728\u4e0b\u4e00\u6bb5\u611f\u60c5\u88e1\u4f60\u7684\u53d7\u50b7\u738710%\u3002\u73fe\u5728\u7684\u4f60\uff0c\u5df2\u7d93\u4e0d\u518d\u61a7\u61ac\u8457\u4e00\u6bb5\u8f5f\u8f5f\u70c8\u70c8\u7684\u611b\u60c5\uff0c\u4f60\u66f4\u56ae\u5f80\u64c1\u6709\u4e00\u6bb5\u7d30\u6c34\u9577\u6d41\u7684\u611f\u60c5\u3002\u4f60\u4e0d\u6703\u518d\u4e0d\u9867\u5f8c\u679c\u5730\u53bb\u611b\u4e00\u500b\u4eba\uff0c\u4e5f\u4e0d\u6703\u76f2\u76ee\u5730\u559c\u6b61\u4e0a\u4e00\u500b\u4e0d\u53ef\u80fd\u559c\u6b61\u4f60\u7684\u4eba\u3002\u5728\u4e0b\u4e00\u6bb5\u611f\u60c5\u88e1\uff0c\u4f60\u662f\u8a8d\u771f\u7684\uff0c\u800c\u559c\u6b61\u4f60\u7684TA\uff0c\u4e5f\u662f\u8a8d\u771f\u7684\u3002\u4f60\u5011\u7684\u611f\u60c5\u6703\u5f88\u7a69\u5b9a\u4e14\u9577\u4e45\u3002'\n                },\n                D: {\n                    rate: 50,\n                    description: '\u5728\u4e0b\u4e00\u6bb5\u611f\u60c5\u88e1\u4f60\u7684\u53d7\u50b7\u7387\u70ba50%\u3002\u5728\u4e0b\u4e00\u6bb5\u611f\u60c5\u88e1\uff0c\u4f60\u4f9d\u820a\u6703\u5168\u5fc3\u5168\u610f\u5730\u611b\u8457\u4e00\u500b\u4eba\uff0c\u4e0d\u904e\uff0c\u4f60\u7121\u610f\u4e2d\u7684\u4e00\u4e9b\u884c\u70ba\u9084\u662f\u5f88\u5bb9\u6613\u50b7\u5bb3\u5230\u611b\u4f60\u7684TA\u3002\u5982\u679cTA\u4e0d\u7406\u89e3\u4f60\uff0c\u4e5f\u4e0d\u9858\u505a\u51fa\u8b93\u6b65\uff0c\u4f60\u53ef\u80fd\u5c31\u6703\u4e00\u6c23\u4e4b\u4e0b\u63d0\u51fa\u5206\u624b\u3002\u82e5\u662f\u5c0d\u65b9\u7e7c\u7e8c\u7121\u52d5\u65bc\u8877\uff0c\u4f60\u5011\u7684\u611f\u60c5\u53ef\u80fd\u8aaa\u7d50\u675f\u4e5f\u5c31\u7d50\u675f\u4e86\u3002\u5efa\u8b70\u4f60\u591a\u4e00\u4e9b\u6e9d\u901a\u548c\u7406\u89e3\u3002'\n                }\n            };\n            \n            let currentChart = null;\n            let selectedOption = null;\n            \n            \/\/ DOM\u5143\u7d20\u7de9\u5b58\n            const elements = {\n                intro: null,\n                main: null,\n                result: null,\n                damageRate: null,\n                resultDescription: null,\n                chartCanvas: null\n            };\n            \n            \/\/ \u521d\u59cb\u5316DOM\u5143\u7d20\n            function initElements() {\n                elements.intro = document.getElementById('quizintro9');\n                elements.main = document.getElementById('quizmain9');\n                elements.result = document.getElementById('quizresult9');\n                elements.damageRate = document.getElementById('damageRate9');\n                elements.resultDescription = document.getElementById('resultDescription9');\n                elements.chartCanvas = document.getElementById('resultChart9');\n            }\n            \n            \/\/ \u986f\u793a\u6307\u5b9a\u9801\u9762\n            function showPage(page) {\n                \/\/ \u96b1\u85cf\u6240\u6709\u9801\u9762\n                if (elements.intro) elements.intro.style.display = 'none';\n                if (elements.main) elements.main.style.display = 'none';\n                if (elements.result) elements.result.style.display = 'none';\n                \n                \/\/ \u986f\u793a\u6307\u5b9a\u9801\u9762\n                switch(page) {\n                    case 'intro':\n                        if (elements.intro) {\n                            elements.intro.style.display = 'block';\n                            scrollToTop();\n                        }\n                        break;\n                    case 'main':\n                        if (elements.main) {\n                            elements.main.style.display = 'block';\n                            scrollToTop();\n                        }\n                        break;\n                    case 'result':\n                        if (elements.result) {\n                            elements.result.style.display = 'block';\n                            scrollToTop();\n                        }\n                        break;\n                }\n            }\n            \n            \/\/ \u6efe\u52d5\u5230\u9802\u90e8\n            function scrollToTop() {\n                const container = document.querySelector('.quiz-container-9');\n                if (container) {\n                    container.scrollIntoView({ behavior: 'smooth', block: 'start' });\n                }\n            }\n            \n            \/\/ \u958b\u59cb\u6e2c\u9a57\n            function startQuiz() {\n                initElements();\n                showPage('main');\n                selectedOption = null;\n                \n                \/\/ \u6e05\u9664\u4e4b\u524d\u7684\u9078\u64c7\u72c0\u614b\n                const buttons = document.querySelectorAll('.option-btn-9');\n                buttons.forEach(btn => btn.classList.remove('selected'));\n            }\n            \n            \/\/ \u9078\u64c7\u9078\u9805\n            function selectOption(option) {\n                selectedOption = option;\n                \n                \/\/ \u66f4\u65b0\u6309\u9215\u72c0\u614b\n                const buttons = document.querySelectorAll('.option-btn-9');\n                buttons.forEach(btn => {\n                    btn.classList.remove('selected');\n                    if (btn.dataset.option === option) {\n                        btn.classList.add('selected');\n                    }\n                });\n                \n                \/\/ \u5ef6\u9072\u986f\u793a\u7d50\u679c\n                setTimeout(() => {\n                    showResult();\n                }, 500);\n            }\n            \n            \/\/ \u986f\u793a\u7d50\u679c\n            function showResult() {\n                if (!selectedOption || !quizData[selectedOption]) return;\n                \n                const result = quizData[selectedOption];\n                showPage('result');\n                \n                \/\/ \u66f4\u65b0\u7d50\u679c\u5167\u5bb9\n                if (elements.damageRate) {\n                    elements.damageRate.textContent = result.rate + '%';\n                }\n                \n                if (elements.resultDescription) {\n                    elements.resultDescription.innerHTML = `\n                        <h4 class=\"mb-3\">\u8a73\u7d30\u5206\u6790<\/h4>\n                        <p>${result.description}<\/p>\n                    `;\n                }\n                \n                \/\/ \u7e6a\u88fd\u5716\u8868\n                drawChart(result.rate);\n            }\n            \n            \/\/ \u7e6a\u88fd\u5716\u8868\n            function drawChart(rate) {\n                \/\/ \u92b7\u6bc0\u4e4b\u524d\u7684\u5716\u8868\u5be6\u4f8b\n                if (currentChart) {\n                    currentChart.destroy();\n                    currentChart = null;\n                }\n                \n                if (!elements.chartCanvas) return;\n                \n                const ctx = elements.chartCanvas.getContext('2d');\n                \n                \/\/ \u6839\u64da\u53d7\u50b7\u7387\u9078\u64c7\u984f\u8272\n                let color;\n                if (rate <= 30) {\n                    color = 'rgba(168, 230, 207, 0.8)'; \/\/ \u7da0\u8272\u7cfb - \u4f4e\u98a8\u96aa\n                } else if (rate <= 60) {\n                    color = 'rgba(255, 206, 84, 0.8)'; \/\/ \u9ec3\u8272\u7cfb - \u4e2d\u7b49\u98a8\u96aa\n                } else {\n                    color = 'rgba(118, 75, 162, 0.8)'; \/\/ \u7d2b\u8272\u7cfb - \u9ad8\u98a8\u96aa\n                }\n                \n                currentChart = new Chart(ctx, {\n                    type: 'doughnut',\n                    data: {\n                        labels: ['\u53d7\u50b7\u98a8\u96aa', '\u5b89\u5168\u7a7a\u9593'],\n                        datasets: [{\n                            data: [rate, 100 - rate],\n                            backgroundColor: [\n                                color,\n                                'rgba(240, 240, 240, 0.5)'\n                            ],\n                            borderColor: [\n                                color.replace('0.8', '1'),\n                                'rgba(200, 200, 200, 0.5)'\n                            ],\n                            borderWidth: 2\n                        }]\n                    },\n                    options: {\n                        responsive: true,\n                        maintainAspectRatio: false,\n                        plugins: {\n                            legend: {\n                                position: 'bottom',\n                                labels: {\n                                    font: {\n                                        size: 18,\n                                        family: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif'\n                                    },\n                                    padding: 20,\n                                    color: '#2c3e50'\n                                }\n                            },\n                            tooltip: {\n                                callbacks: {\n                                    label: function(context) {\n                                        return context.label + ': ' + context.parsed + '%';\n                                    }\n                                },\n                                bodyFont: {\n                                    size: 16\n                                }\n                            }\n                        },\n                        cutout: '60%'\n                    }\n                });\n            }\n            \n            \/\/ \u8fd4\u56de\n            function goBack() {\n                showPage('intro');\n            }\n            \n            \/\/ \u91cd\u65b0\u958b\u59cb\n            function restart() {\n                \/\/ \u92b7\u6bc0\u5716\u8868\n                if (currentChart) {\n                    currentChart.destroy();\n                    currentChart = null;\n                }\n                selectedOption = null;\n                showPage('intro');\n            }\n            \n            \/\/ \u521d\u59cb\u5316\n            document.addEventListener('DOMContentLoaded', initElements);\n            \n            \/\/ \u516c\u958bAPI\n            return {\n                startQuiz,\n                selectOption,\n                goBack,\n                restart\n            };\n        })();\n    <\/script>","protected":false},"excerpt":{"rendered":"<p>\u5728\u7ecf\u5386\u4e00\u6b21\u6b21\u7684\u4f24\u5bb3\u540e\uff0c\u4f60\u4f1a\u96be\u8fc7\uff0c\u4e5f\u4f1a\u5bb3\u6015\u3002\u6e10\u6e10\u5730\uff0c\u54ea\u6015\u4f60\u5bf9\u7231\u60c5\u5fc3\u6000\u61a7\u61ac\uff0c\u5374\u5df2\u4e0d\u6562\u8f7b\u6613\u6295\u5165\u5230\u611f\u60c5\u4e2d\uff0c\u5bb3\u6015\u81ea\u5df1\u4f1a\u518d\u6b21\u53d7\u4f24\uff0c\u5bb3\u6015\u5206\u624b\u6240\u9020\u6210\u7684\u4f24\u5bb3\u4f1a\u6bc1\u6389\u5728\u4e00\u8d77\u7684\u7f8e\u597d\u3002\u90a3\u4e48\uff0c\u5728\u4e0b\u4e00\u6bb5\u611f\u60c5\u91cc\u4f60\u7684\u300c\u53d7\u4f24\u7387\u300d\u6709\u591a\u9ad8\uff1f<\/p>","protected":false},"author":19,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"disabled","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[178],"tags":[],"class_list":["post-2582","post","type-post","status-publish","format-standard","hentry","category-love"],"_links":{"self":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2582","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/users\/19"}],"replies":[{"embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/comments?post=2582"}],"version-history":[{"count":1,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2582\/revisions"}],"predecessor-version":[{"id":10510,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2582\/revisions\/10510"}],"wp:attachment":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/media?parent=2582"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/categories?post=2582"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/tags?post=2582"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}