{"id":2423,"date":"2023-10-24T09:21:50","date_gmt":"2023-10-24T01:21:50","guid":{"rendered":"https:\/\/bookmark.tw\/?p=2423"},"modified":"2025-08-29T21:57:40","modified_gmt":"2025-08-29T13:57:40","slug":"love-from-waiting-or-seeking","status":"publish","type":"post","link":"https:\/\/xinliceyan.org\/zh\/love-from-waiting-or-seeking","title":{"rendered":"\u5c0f\u6d4b\u9a8c\uff1a\u4f60\u7684\u771f\u7231\u300c\u9760\u7b49\u300d\u8fd8\u662f\u300c\u9760\u6c42\u300d\uff1f"},"content":{"rendered":"<!-- \u5f15\u5165 Bootstrap CSS -->\n<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\n<!-- \u5f15\u5c0e\u9801 -->\n<section id=\"quizintro9\" data-page=\"intro9\" class=\"quiz-container9 py-5\">\n  <div class=\"quiz-content9\">\n    <header class=\"text-center mb-5\">\n      <h2 class=\"display-5 fw-bold mb-3\" style=\"color: #2d6a4f; font-size: 2.5rem;\">\n        \u4f60\u7684\u771f\u611b\u300c\u9760\u7b49\u300d\u9084\u662f\u300c\u9760\u6c42\u300d\uff1f\n      <\/h2>\n      <p class=\"lead text-muted fs-5\">\u63a2\u7d22\u5c6c\u65bc\u4f60\u7684\u611b\u60c5\u6a21\u5f0f\uff0c\u627e\u5230\u901a\u5f80\u771f\u611b\u7684\u6700\u4f73\u8def\u5f91<\/p>\n    <\/header>\n    \n    <div class=\"row g-4 mb-5\">\n      <div class=\"col-md-6\">\n        <div class=\"card h-100 border-0 shadow-sm\" style=\"background: linear-gradient(135deg, #81c784 0%, #66bb6a 100%);\">\n          <div class=\"card-body text-white p-4\">\n            <div class=\"rounded-circle bg-white bg-opacity-25 d-inline-flex align-items-center justify-content-center mb-3\" style=\"width: 60px; height: 60px;\">\n              <i class=\"bi bi-heart-fill fs-3\"><\/i>\n            <\/div>\n            <h4 class=\"fw-bold mb-2\">\u6df1\u5ea6\u89e3\u6790<\/h4>\n            <p class=\"mb-0 opacity-90\">\u900f\u904e\u5fc3\u7406\u5b78\u5716\u50cf\u6e2c\u8a66\uff0c\u7cbe\u6e96\u5206\u6790\u4f60\u7684\u611b\u60c5\u6a21\u5f0f<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"col-md-6\">\n        <div class=\"card h-100 border-0 shadow-sm\" style=\"background: linear-gradient(135deg, #4db6ac 0%, #26a69a 100%);\">\n          <div class=\"card-body text-white p-4\">\n            <div class=\"rounded-circle bg-white bg-opacity-25 d-inline-flex align-items-center justify-content-center mb-3\" style=\"width: 60px; height: 60px;\">\n              <i class=\"bi bi-compass-fill fs-3\"><\/i>\n            <\/div>\n            <h4 class=\"fw-bold mb-2\">\u611b\u60c5\u6307\u5f15<\/h4>\n            <p class=\"mb-0 opacity-90\">\u7372\u5f97\u500b\u4eba\u5316\u5efa\u8b70\uff0c\u627e\u5230\u6700\u9069\u5408\u4f60\u7684\u6200\u611b\u65b9\u5f0f<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n    \n    <div class=\"text-start mb-5 px-2\">\n      <h4 class=\"fw-bold mb-3\" style=\"color: #2d6a4f;\">\u70ba\u4ec0\u9ebc\u8981\u505a\u9019\u500b\u6e2c\u8a66\uff1f<\/h4>\n      <p class=\"text-muted fs-5 mb-3\">\n        \u90fd\u8bf4\u771f\u7231\u96be\u5bfb\uff0c\u4f46\u6211\u4eec\u4ecd\u7136\u8981\u5bf9\u5bfb\u627e\u771f\u7231\u62b1\u6709\u4fe1\u5fc3\u3002\u6709\u4e9b\u4eba\u53ea\u8981\u7b49\u5728\u539f\u5730\uff0c\u771f\u7231\u5c31\u4f1a\u6765\u7684\uff0c\u800c\u6709\u4e9b\u4eba\u5374\u9700\u8981\u4e3b\u52a8\u53bb\u8ffd\u5bfb\u624d\u80fd\u5f97\u5230\u771f\u7231\u3002\n      <\/p>\n      <p class=\"text-muted fs-5\">\n        \u9019\u500b\u6e2c\u8a66\u5c07\u900f\u904e\u4f60\u5c0d\u5716\u50cf\u7684\u76f4\u89ba\u53cd\u61c9\uff0c\u63ed\u793a\u4f60\u5167\u5fc3\u6df1\u8655\u7684\u611b\u60c5\u6a21\u5f0f\uff0c\u5e6b\u52a9\u4f60\u4e86\u89e3\u81ea\u5df1\u5728\u611b\u60c5\u4e2d\u61c9\u8a72\u63a1\u53d6\u7684\u6700\u4f73\u7b56\u7565\u3002\n      <\/p>\n    <\/div>\n    \n    <div class=\"text-center\">\n      <button id=\"startQuiz9\" class=\"btn btn-lg px-5 py-3 text-white fw-bold shadow-sm\" \n              style=\"background: linear-gradient(135deg, #81c784 0%, #66bb6a 100%);                      border: none;                      border-radius: 50px;                      font-size: 1.2rem;                     transition: all 0.3s ease;\">\n        <i class=\"bi bi-arrow-right-circle-fill me-2\"><\/i>\u5f00\u59cb\u6d4b\u8bd5\n      <\/button>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- \u6e2c\u8a66\u9801 -->\n<section id=\"quizmain9\" data-page=\"quiz9\" class=\"quiz-container9 py-5\" style=\"display: none;\">\n  <div class=\"quiz-content9\">\n    <header class=\"text-center mb-5\">\n      <h2 class=\"fw-bold\" style=\"color: #2d6a4f;\">\u611b\u60c5\u6a21\u5f0f\u6e2c\u8a66<\/h2>\n    <\/header>\n    \n    <div class=\"mb-5\">\n      <h3 class=\"fw-bold mb-4 text-center\" style=\"font-size: 22px; color: #2d3748;\">\n        \u4e0b\u9762\u56db\u5f35\u5716\uff0c\u54ea\u4e00\u5f35\u5716\u66f4\u5bb9\u6613\u8b93\u4f60\u7522\u751f\u5b64\u7368\u611f\uff1f\n      <\/h3>\n      \n      <div class=\"row g-3\">\n        <div class=\"col-12 col-md-6\">\n          <button class=\"quiz-option9 btn w-100 p-0 border-0\" data-option=\"1\">\n            <div class=\"card h-100 shadow-sm border-0\" style=\"transition: all 0.3s ease;\">\n              <img decoding=\"async\" src=\"https:\/\/xinliceyan.org\/wp-content\/uploads\/2025\/08\/gudugan1.jpg\" \n                   class=\"card-img-top\" alt=\"\u9078\u9805 1\" style=\"height: 200px; object-fit: cover;\">\n              <div class=\"card-body d-flex align-items-center\">\n                <div class=\"option-indicator9 rounded-circle border border-2 me-3\" \n                     style=\"width: 24px; height: 24px; min-width: 24px; border-color: #c8e6c9;\">\n                <\/div>\n                <span style=\"font-size: 18px; color: #2e7d32;\">\u9078\u9805 1<\/span>\n              <\/div>\n            <\/div>\n          <\/button>\n        <\/div>\n        \n        <div class=\"col-12 col-md-6\">\n          <button class=\"quiz-option9 btn w-100 p-0 border-0\" data-option=\"2\">\n            <div class=\"card h-100 shadow-sm border-0\" style=\"transition: all 0.3s ease;\">\n              <img decoding=\"async\" src=\"https:\/\/xinliceyan.org\/wp-content\/uploads\/2025\/08\/gudugan2.jpg\" \n                   class=\"card-img-top\" alt=\"\u9078\u9805 2\" style=\"height: 200px; object-fit: cover;\">\n              <div class=\"card-body d-flex align-items-center\">\n                <div class=\"option-indicator9 rounded-circle border border-2 me-3\" \n                     style=\"width: 24px; height: 24px; min-width: 24px; border-color: #c8e6c9;\">\n                <\/div>\n                <span style=\"font-size: 18px; color: #2e7d32;\">\u9078\u9805 2<\/span>\n              <\/div>\n            <\/div>\n          <\/button>\n        <\/div>\n        \n        <div class=\"col-12 col-md-6\">\n          <button class=\"quiz-option9 btn w-100 p-0 border-0\" data-option=\"3\">\n            <div class=\"card h-100 shadow-sm border-0\" style=\"transition: all 0.3s ease;\">\n              <img decoding=\"async\" src=\"https:\/\/xinliceyan.org\/wp-content\/uploads\/2025\/08\/gudugan3.jpg\" \n                   class=\"card-img-top\" alt=\"\u9078\u9805 3\" style=\"height: 200px; object-fit: cover;\">\n              <div class=\"card-body d-flex align-items-center\">\n                <div class=\"option-indicator9 rounded-circle border border-2 me-3\" \n                     style=\"width: 24px; height: 24px; min-width: 24px; border-color: #c8e6c9;\">\n                <\/div>\n                <span style=\"font-size: 18px; color: #2e7d32;\">\u9078\u9805 3<\/span>\n              <\/div>\n            <\/div>\n          <\/button>\n        <\/div>\n        \n        <div class=\"col-12 col-md-6\">\n          <button class=\"quiz-option9 btn w-100 p-0 border-0\" data-option=\"4\">\n            <div class=\"card h-100 shadow-sm border-0\" style=\"transition: all 0.3s ease;\">\n              <img decoding=\"async\" src=\"https:\/\/xinliceyan.org\/wp-content\/uploads\/2025\/08\/gudugan4.jpg\" \n                   class=\"card-img-top\" alt=\"\u9078\u9805 4\" style=\"height: 200px; object-fit: cover;\">\n              <div class=\"card-body d-flex align-items-center\">\n                <div class=\"option-indicator9 rounded-circle border border-2 me-3\" \n                     style=\"width: 24px; height: 24px; min-width: 24px; border-color: #c8e6c9;\">\n                <\/div>\n                <span style=\"font-size: 18px; color: #2e7d32;\">\u9078\u9805 4<\/span>\n              <\/div>\n            <\/div>\n          <\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- \u7d50\u679c\u9801 -->\n<section id=\"quizresult9\" data-page=\"result9\" class=\"quiz-container9 py-5\" style=\"display: none;\">\n  <div class=\"quiz-content9\">\n    <header class=\"text-center mb-5\">\n      <h2 class=\"fw-bold\" style=\"color: #2d6a4f;\">\u4f60\u7684\u611b\u60c5\u6a21\u5f0f\u5206\u6790<\/h2>\n    <\/header>\n    \n    <div class=\"card border-0 shadow-sm mb-4\" style=\"background: linear-gradient(135deg, rgba(129, 199, 132, 0.1) 0%, rgba(102, 187, 106, 0.1) 100%);\">\n      <div class=\"card-body p-4\">\n        <h3 id=\"resultTitle9\" class=\"fw-bold mb-3 text-center\" style=\"color: #2d6a4f;\"><\/h3>\n        <p id=\"resultDescription9\" class=\"fs-5 text-muted\"><\/p>\n      <\/div>\n    <\/div>\n    \n    <div class=\"row mb-4\">\n      <div class=\"col-12\">\n        <div class=\"card border-0 shadow-sm\">\n          <div class=\"card-body p-4\">\n            <h4 class=\"fw-bold mb-3 text-center\" style=\"color: #2d6a4f;\">\u611b\u60c5\u6a21\u5f0f\u7279\u8cea\u5206\u6790<\/h4>\n            <div class=\"d-flex justify-content-center\">\n              <canvas id=\"loveChart9\" style=\"max-width: 350px; max-height: 350px;\"><\/canvas>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n    \n    <div class=\"text-center mt-5\">\n      <button id=\"restartQuiz9\" class=\"btn btn-lg px-5 py-3 text-white fw-bold shadow-sm\" \n              style=\"background: linear-gradient(135deg, #81c784 0%, #66bb6a 100%);                      border: none;                      border-radius: 50px;                      font-size: 1.1rem;                     transition: all 0.3s ease;\">\n        <i class=\"bi bi-arrow-clockwise me-2\"><\/i>\u91cd\u65b0\u6d4b\u8bd5\n      <\/button>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- CSS -->\n<style>\n  \/* \u5bb9\u5668\u9650\u5236\u6700\u5927\u5bec\u5ea6 *\/\n  .quiz-container9 {\n    max-width: 750px;\n    margin: 0 auto;\n    padding-left: 15px;\n    padding-right: 15px;\n  }\n  \n  .quiz-content9 {\n    width: 100%;\n  }\n  \n  \/* \u6309\u9215\u61f8\u505c\u6548\u679c *\/\n  #startQuiz9:hover, #restartQuiz9:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 8px 16px rgba(0,0,0,0.15) !important;\n  }\n  \n  \/* \u9078\u9805\u5361\u7247\u61f8\u505c\u6548\u679c *\/\n  .quiz-option9:hover .card {\n    transform: translateY(-3px);\n    box-shadow: 0 8px 20px rgba(0,0,0,0.12) !important;\n  }\n  \n  \/* \u9078\u4e2d\u72c0\u614b *\/\n  .quiz-option9.selected .card {\n    border: 2px solid #66bb6a !important;\n    background-color: rgba(129, 199, 132, 0.05);\n  }\n  \n  .quiz-option9.selected .option-indicator9 {\n    background: linear-gradient(135deg, #81c784 0%, #66bb6a 100%);\n    border-color: #66bb6a !important;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  \n  .quiz-option9.selected .option-indicator9::after {\n    content: '\u2713';\n    color: white;\n    font-weight: bold;\n    font-size: 14px;\n  }\n  \n  \/* \u5361\u7247\u6a23\u5f0f *\/\n  .card {\n    box-shadow: 0 2px 8px rgba(0,0,0,0.08);\n  }\n  \n  \/* \u9801\u9762\u904e\u6e21\u52d5\u756b *\/\n  .fade-in {\n    animation: fadeIn 0.4s ease-in;\n  }\n  \n  @keyframes fadeIn {\n    from { \n      opacity: 0; \n      transform: translateY(10px); \n    }\n    to { \n      opacity: 1; \n      transform: translateY(0); \n    }\n  }\n  \n  \/* \u97ff\u61c9\u5f0f\u8abf\u6574 *\/\n  @media (max-width: 767px) {\n    .display-5 {\n      font-size: 1.8rem !important;\n    }\n    \n    .lead {\n      font-size: 1.1rem !important;\n    }\n    \n    #startQuiz9, #restartQuiz9 {\n      font-size: 1rem !important;\n      padding: 0.75rem 2rem !important;\n    }\n    \n    .quiz-option9 img {\n      height: 180px !important;\n    }\n    \n    h3 {\n      font-size: 20px !important;\n    }\n  }\n  \n  \/* \u78ba\u4fdd\u6587\u5b57\u6e05\u6670\u53ef\u898b *\/\n  .text-muted {\n    color: #6c757d !important;\n  }\n  \n  \/* \u79fb\u9664\u591a\u9918\u80cc\u666f\u8272 *\/\n  body, section {\n    background: transparent !important;\n  }\n<\/style>\n\n<!-- JavaScript -->\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/bootstrap\/5.3.3\/js\/bootstrap.bundle.min.js\"><\/script>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/Chart.js\/4.4.1\/chart.umd.min.js\"><\/script>\n<script>\n(function() {\n  'use strict';\n  \n  class LoveQuiz {\n    constructor() {\n      this.currentPage = 'intro9';\n      this.selectedOption = null;\n      this.chartInstance = null;\n      \n      \/\/ \u5feb\u53d6 DOM \u5143\u7d20\n      this.introPage = document.getElementById('quizintro9');\n      this.quizPage = document.getElementById('quizmain9');\n      this.resultPage = document.getElementById('quizresult9');\n      this.startBtn = document.getElementById('startQuiz9');\n      this.restartBtn = document.getElementById('restartQuiz9');\n      this.options = document.querySelectorAll('.quiz-option9');\n      \n      this.results = {\n        1: {\n          title: '\u7b49\u5f85\u611b\u60c5',\n          description: '\u8010\u5fc3\u5730\u7b49\u5f85\uff0c\u611b\u60c5\u5c31\u6703\u964d\u81e8\u3002\u4f60\u500b\u6027\u6bd4\u8f03\u885d\u52d5\uff0c\u5982\u679c\u4e3b\u52d5\u8ffd\u6c42\u611b\u60c5\uff0c\u53ef\u80fd\u6703\u56e0\u70ba\u885d\u52d5\u770b\u932f\u4eba\u3002\u4f60\u4e0d\u9700\u8981\u5728\u611b\u60c5\u65b9\u9762\u8868\u73fe\u5f97\u592a\u904e\u7a4d\u6975\u4e3b\u52d5\uff0c\u5176\u5be6\u4f60\u7684\u500b\u4eba\u9b45\u529b\u80fd\u5920\u5e6b\u4f60\u5438\u5f15\u5230\u4e0d\u932f\u7684\u7570\u6027\uff0c\u884c\u52d5\u529b\u8d85\u5f37\u7684\u4f60\u82e5\u4e3b\u52d5\u8ffd\u6c42\u611b\u60c5\uff0c\u6703\u986f\u5f97\u6bd4\u8f03\u6cb9\u6ed1\uff0c\u4e0d\u5982\u8a66\u8457\u505a\u4e00\u500b\u96f2\u6de1\u98a8\u8f15\u7684\u4eba\uff0c\u611b\u60c5\u5c31\u6703\u4e0d\u8acb\u81ea\u4f86\u3002',\n          chartData: {\n            patience: 90,\n            initiative: 30,\n            charm: 85,\n            wisdom: 75\n          }\n        },\n        2: {\n          title: '\u8ffd\u6c42\u611b\u60c5',\n          description: '\u5728\u611f\u60c5\u65b9\u9762\u4f60\u7684\u8868\u73fe\u5be6\u5728\u662f\u592a\u88ab\u52d5\u4e86\uff0c\u559c\u6b61\u4e00\u500b\u4eba\uff0c\u751a\u81f3\u53ef\u4ee5\u55ae\u6200\u5c0d\u65b9\u5f88\u9577\u6642\u9593\uff0c\u4f60\u81f3\u5c11\u61c9\u8a72\u8b93\u5c0d\u65b9\u77e5\u9053\u4f60\u7684\u9019\u4efd\u5fc3\u610f\uff0c\u53ef\u4ee5\u9069\u7576\u7684\u88fd\u9020\u76f8\u8655\u7684\u6a5f\u6703\uff0c\u9019\u6a23\u624d\u80fd\u5920\u5728\u5c0d\u65b9\u9762\u524d\u5c55\u793a\u51fa\u81ea\u5df1\u7684\u500b\u4eba\u9b45\u529b\u4f86\uff0c\u81f3\u5c11\u8981\u7d66\u5c0d\u65b9\u4e00\u500b\u77ad\u89e3\u4f60\u7684\u6a5f\u6703\uff0c\u5426\u5247\u4f60\u7528\u4ec0\u9ebc\u53bb\u5438\u5f15\u4f60\u559c\u6b61\u7684\u4eba\u5462\uff1f\u4e3b\u52d5\u53bb\u8ffd\u6c42\u611b\u60c5\u5427\u3002',\n          chartData: {\n            patience: 40,\n            initiative: 85,\n            charm: 70,\n            wisdom: 80\n          }\n        },\n        3: {\n          title: '\u96a8\u6027\u5373\u53ef',\n          description: '\u7121\u8ad6\u662f\u4e3b\u52d5\u8ffd\u6c42\u611b\u60c5\uff0c\u9084\u662f\u8010\u5fc3\u7b49\u5f85\u611b\u60c5\uff0c\u611b\u60c5\u90fd\u6703\u964d\u81e8\uff0c\u53ef\u4ee5\u7528\u96a8\u6027\u4e00\u9ede\u7684\u614b\u5ea6\u53bb\u5c0d\u5f85\u611b\u60c5\uff0c\u9047\u5230\u559c\u6b61\u7684\u4eba\u8868\u73fe\u5f97\u5927\u65b9\u81ea\u7136\u9ede\uff0c\u76f8\u4fe1\u4f60\u80fd\u5920\u6253\u52d5\u5c0d\u65b9\u3002\u65e2\u4e0d\u4e3b\u52d5\uff0c\u4e5f\u4e0d\u88ab\u52d5\uff0c\u548c\u559c\u6b61\u7684\u4eba\u5728\u4e00\u8d77\uff0c\u4f60\u53ef\u4ee5\u62b1\u8457\u4f60\u4f86\u6211\u5f80\u7684\u614b\u5ea6\uff0c\u5c0d\u65b9\u5c0d\u4f60\u597d\u4e00\u5206\uff0c\u4f60\u4e5f\u56de\u5831\u5c0d\u65b9\u4e00\u5206\u5c31\u884c\u4e86\uff0c\u9806\u5176\u81ea\u7136\uff0c\u53cd\u800c\u66f4\u5bb9\u6613\u64c1\u6709\u4f60\u60f3\u8981\u7684\u611b\u60c5\u3002',\n          chartData: {\n            patience: 65,\n            initiative: 65,\n            charm: 80,\n            wisdom: 85\n          }\n        },\n        4: {\n          title: '\u96d9\u91cd\u52aa\u529b',\n          description: '\u4f60\u53ef\u4ee5\u5148\u5c0d\u559c\u6b61\u7684\u4eba\u767c\u8d77\u731b\u70c8\u653b\u52e2\uff0c\u7136\u5f8c\u518d\u8010\u5fc3\u7684\u7b49\u5f85\u611b\u60c5\uff0c\u7528\u9019\u5169\u7a2e\u65b9\u6cd5\u7372\u53d6\u60f3\u8981\u7684\u611b\u60c5\uff0c\u4ed8\u51fa\u96d9\u91cd\u7684\u52aa\u529b\uff0c\u6700\u7d42\u4f60\u6703\u6536\u7a6b\u4f60\u60f3\u8981\u7684\u7d50\u679c\u3002\u4ec0\u9ebc\u6642\u5019\u767c\u8d77\u731b\u70c8\u653b\u52e2\uff1f\u4ec0\u9ebc\u6642\u5019\u958b\u555f\u8010\u5fc3\u7b49\u5f85\uff0c\u9019\u500b\u5c3a\u5ea6\u9700\u8981\u4f60\u81ea\u5df1\u53bb\u628a\u63e1\uff0c\u5982\u679c\u4f60\u80fd\u628a\u9019\u500b\u5c3a\u5ea6\u638c\u63a7\u5f97\u5f88\u597d\uff0c\u5c31\u53ef\u4ee5\u5728\u6293\u7372\u611b\u60c5\u65b9\u9762\u6709\u5b8c\u7f8e\u7684\u767c\u63ee\u3002',\n          chartData: {\n            patience: 75,\n            initiative: 75,\n            charm: 75,\n            wisdom: 90\n          }\n        }\n      };\n      \n      this.init();\n    }\n    \n    init() {\n      this.bindEvents();\n    }\n    \n    bindEvents() {\n      \/\/ \u958b\u59cb\u6e2c\u8a66\u6309\u9215\n      this.startBtn.addEventListener('click', () => this.showQuiz());\n      \n      \/\/ \u91cd\u65b0\u6e2c\u8a66\u6309\u9215\n      this.restartBtn.addEventListener('click', () => this.restart());\n      \n      \/\/ \u9078\u9805\u9ede\u64ca\n      this.options.forEach(option => {\n        option.addEventListener('click', (e) => this.selectOption(e));\n      });\n    }\n    \n    showQuiz() {\n      this.switchPage('quiz9');\n      this.scrollToTop();\n    }\n    \n    selectOption(e) {\n      const option = e.currentTarget;\n      const optionValue = option.dataset.option;\n      \n      \/\/ \u6e05\u9664\u4e4b\u524d\u7684\u9078\u64c7\n      this.options.forEach(opt => opt.classList.remove('selected'));\n      \n      \/\/ \u6a19\u8a18\u7576\u524d\u9078\u64c7\n      option.classList.add('selected');\n      this.selectedOption = optionValue;\n      \n      \/\/ \u5ef6\u9072\u63d0\u4ea4\uff0c\u7d66\u7528\u6236\u770b\u5230\u9078\u4e2d\u6548\u679c\n      setTimeout(() => {\n        this.showResult();\n      }, 500);\n    }\n    \n    showResult() {\n      const result = this.results[this.selectedOption];\n      \n      \/\/ \u66f4\u65b0\u7d50\u679c\u5167\u5bb9\n      document.getElementById('resultTitle9').textContent = result.title;\n      document.getElementById('resultDescription9').textContent = result.description;\n      \n      \/\/ \u5207\u63db\u5230\u7d50\u679c\u9801\n      this.switchPage('result9');\n      this.scrollToTop();\n      \n      \/\/ \u5275\u5efa\u5716\u8868\n      setTimeout(() => {\n        this.createChart(result.chartData);\n      }, 300);\n    }\n    \n    createChart(data) {\n      \/\/ \u92b7\u6bc0\u4e4b\u524d\u7684\u5716\u8868\u5be6\u4f8b\n      if (this.chartInstance) {\n        this.chartInstance.destroy();\n      }\n      \n      const ctx = document.getElementById('loveChart9').getContext('2d');\n      \n      this.chartInstance = new Chart(ctx, {\n        type: 'radar',\n        data: {\n          labels: ['\u8010\u5fc3\u6307\u6578', '\u4e3b\u52d5\u6307\u6578', '\u9b45\u529b\u6307\u6578', '\u667a\u6167\u6307\u6578'],\n          datasets: [{\n            label: '\u4f60\u7684\u611b\u60c5\u7279\u8cea',\n            data: [data.patience, data.initiative, data.charm, data.wisdom],\n            backgroundColor: 'rgba(102, 187, 106, 0.2)',\n            borderColor: 'rgba(102, 187, 106, 1)',\n            borderWidth: 2,\n            pointBackgroundColor: 'rgba(102, 187, 106, 1)',\n            pointBorderColor: '#fff',\n            pointHoverBackgroundColor: '#fff',\n            pointHoverBorderColor: 'rgba(102, 187, 106, 1)',\n            pointRadius: 5,\n            pointHoverRadius: 7\n          }]\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: true,\n          plugins: {\n            legend: {\n              display: false\n            },\n            tooltip: {\n              callbacks: {\n                label: function(context) {\n                  return context.label + ': ' + context.parsed.r + '%';\n                }\n              }\n            }\n          },\n          scales: {\n            r: {\n              beginAtZero: true,\n              max: 100,\n              ticks: {\n                stepSize: 20,\n                font: {\n                  size: 14\n                }\n              },\n              pointLabels: {\n                font: {\n                  size: 18,\n                  weight: 'bold'\n                },\n                color: '#2d6a4f'\n              },\n              grid: {\n                color: 'rgba(0, 0, 0, 0.05)'\n              }\n            }\n          }\n        }\n      });\n    }\n    \n    restart() {\n      \/\/ \u91cd\u7f6e\u9078\u64c7\n      this.selectedOption = null;\n      this.options.forEach(opt => opt.classList.remove('selected'));\n      \n      \/\/ \u92b7\u6bc0\u5716\u8868\n      if (this.chartInstance) {\n        this.chartInstance.destroy();\n        this.chartInstance = null;\n      }\n      \n      \/\/ \u8fd4\u56de\u5f15\u5c0e\u9801\n      this.switchPage('intro9');\n      this.scrollToTop();\n    }\n    \n    switchPage(page) {\n      \/\/ \u96b1\u85cf\u6240\u6709\u9801\u9762\n      this.introPage.style.display = 'none';\n      this.quizPage.style.display = 'none';\n      this.resultPage.style.display = 'none';\n      \n      \/\/ \u986f\u793a\u76ee\u6a19\u9801\u9762\n      const targetPage = document.querySelector(`[data-page=\"${page}\"]`);\n      if (targetPage) {\n        targetPage.style.display = 'block';\n        targetPage.classList.add('fade-in');\n      }\n      \n      this.currentPage = page;\n    }\n    \n    scrollToTop() {\n      const targetElement = document.querySelector(`[data-page=\"${this.currentPage}\"] h2`);\n      if (targetElement) {\n        targetElement.scrollIntoView({ behavior: 'smooth', block: 'start' });\n      }\n    }\n  }\n  \n  \/\/ \u521d\u59cb\u5316\u6e2c\u8a66\n  document.addEventListener('DOMContentLoaded', () => {\n    new LoveQuiz();\n  });\n  \n})();\n<\/script>","protected":false},"excerpt":{"rendered":"<p>\u4f60\u60f3\u77e5\u9053\u4f60\u53ef\u4ee5\u901a\u8fc7\u7b49\u5f85\u5f97\u5230\u771f\u7231\uff0c\u8fd8\u662f\u9700\u8981\u901a\u8fc7\u8ffd\u5bfb\u5f97\u5230\u771f\u7231\u5417\uff1f\u770b\u770b\u4e0b\u6587\u7684\u6d4b\u8bd5\u6216\u8bb8\u5c31\u80fd\u627e\u5230\u7b54\u6848\u4e86\u3002<\/p>","protected":false},"author":19,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"narrow-width-container","site-content-style":"unboxed","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":"disabled","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":"","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":[179,178],"tags":[],"class_list":["post-2423","post","type-post","status-publish","format-standard","hentry","category-marriage","category-love"],"_links":{"self":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2423","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=2423"}],"version-history":[{"count":1,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2423\/revisions"}],"predecessor-version":[{"id":10700,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2423\/revisions\/10700"}],"wp:attachment":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/media?parent=2423"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/categories?post=2423"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/tags?post=2423"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}