{"id":2459,"date":"2023-10-20T08:38:50","date_gmt":"2023-10-20T00:38:50","guid":{"rendered":"https:\/\/bookmark.tw\/?p=2459"},"modified":"2025-08-26T21:02:29","modified_gmt":"2025-08-26T13:02:29","slug":"treasure-or-grass-for-husband","status":"publish","type":"post","link":"https:\/\/xinliceyan.org\/zh\/treasure-or-grass-for-husband","title":{"rendered":"\u5c0f\u6d4b\u9a8c\uff1a\u5728\u4f60\u8001\u516c\u5fc3\u4e2d\u4f60\u662f\u4e2a\u300c\u5b9d\u300d\u8fd8\u662f\u6839\u300c\u8349\u300d"},"content":{"rendered":"<!-- \u5f15\u5165Bootstrap\u548cBootstrap Icons -->\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/bootstrap\/5.3.3\/css\/bootstrap.min.css\">\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/bootstrap-icons\/1.11.3\/font\/bootstrap-icons.min.css\">\n\n<!-- \u5f15\u5c0e\u9801 -->\n<section id=\"quizintro9\" data-page=\"intro9\" class=\"quiz-section py-5\">\n  <div class=\"quiz-container\">\n    <div class=\"text-center position-relative\">\n      <!-- \u88dd\u98fe\u6027\u5713\u5f62\u80cc\u666f -->\n      <div class=\"position-absolute top-0 start-0 w-100 h-100 overflow-hidden\">\n        <div class=\"floating-circle circle-1\"><\/div>\n        <div class=\"floating-circle circle-2\"><\/div>\n        <div class=\"floating-circle circle-3\"><\/div>\n      <\/div>\n      \n      <!-- \u4e3b\u8981\u5167\u5bb9 -->\n      <div class=\"position-relative\">\n        <div class=\"mb-4\">\n          <div class=\"icon-wrapper mx-auto\">\n            <i class=\"bi bi-heart-fill text-white display-4\"><\/i>\n          <\/div>\n        <\/div>\n        \n        <h1 class=\"display-5 fw-bold mb-4 text-primary-custom\">\n          \u5728\u8001\u516c\u5fc3\u4e2d\u4f60\u662f\u500b\u300c\u5bf6\u300d\u9084\u662f\u6839\u300c\u8349\u300d\n        <\/h1>\n        \n        <p class=\"lead mb-5 text-muted px-3\">\n          \u4e0d\u7ba1\u5ac1\u6c92\u5ac1\u4eba\uff0c\u4e0d\u7ba1\u7d50\u6c92\u7d50\u5a5a\uff0c\u5973\u5b69\u5b50\u90fd\u5e0c\u671b\u80fd\u88ab\u8001\u516c\u7576\u6210\u624b\u5fc3\u88e1\u7684\u5bf6\u3002\n          \u4f86\u6e2c\u8a66\u770b\u770b\uff0c\u59b3\u5728\u4ed6\u5fc3\u4e2d\u7684\u771f\u5be6\u5730\u4f4d\u5427\uff01\n        <\/p>\n        \n        <div class=\"d-flex flex-column flex-sm-row gap-3 justify-content-center mb-5\">\n          <div class=\"d-flex align-items-center justify-content-center\">\n            <i class=\"bi bi-clock me-2 text-accent\"><\/i>\n            <span class=\"text-muted\">\u7d043\u5206\u9418<\/span>\n          <\/div>\n          <div class=\"d-flex align-items-center justify-content-center\">\n            <i class=\"bi bi-list-ol me-2 text-accent\"><\/i>\n            <span class=\"text-muted\">10\u9053\u984c\u76ee<\/span>\n          <\/div>\n          <div class=\"d-flex align-items-center justify-content-center\">\n            <i class=\"bi bi-bar-chart me-2 text-accent\"><\/i>\n            <span class=\"text-muted\">\u8be6\u7ec6\u5206\u6790<\/span>\n          <\/div>\n        <\/div>\n        \n        <button class=\"btn btn-primary-custom btn-lg px-5 py-3 rounded-pill shadow-soft hover-lift\" \n                onclick=\"quizManager9.startQuiz()\">\n          <span class=\"me-2\">\u5f00\u59cb\u6d4b\u9a8c<\/span>\n          <i class=\"bi bi-arrow-right-circle\"><\/i>\n        <\/button>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- \u6e2c\u9a57\u9801 -->\n<section id=\"quizmain9\" data-page=\"quiz9\" class=\"quiz-section d-none py-5\">\n  <div class=\"quiz-container\">\n    <!-- \u9032\u5ea6\u689d -->\n    <div class=\"mb-4\">\n      <div class=\"d-flex justify-content-between align-items-center mb-2\">\n        <span class=\"text-muted\">\u9032\u5ea6<\/span>\n        <span class=\"badge badge-custom rounded-pill px-3\" id=\"questionCounter9\">\u95ee\u98981\/10<\/span>\n      <\/div>\n      <div class=\"progress\" style=\"height: 8px;\">\n        <div class=\"progress-bar progress-bar-custom\" role=\"progressbar\" id=\"progressBar9\" \n             style=\"width: 10%\" aria-valuenow=\"10\" aria-valuemin=\"0\" aria-valuemax=\"100\"><\/div>\n      <\/div>\n    <\/div>\n    \n    <!-- \u984c\u76ee\u5340\u57df -->\n    <div class=\"card border-0 shadow-soft mb-4\">\n      <div class=\"card-body p-4\">\n        <h3 id=\"questionTitle9\" class=\"fw-bold mb-4 question-title\"><\/h3>\n        <div id=\"optionsContainer9\" class=\"d-grid gap-3\">\n          <!-- \u9078\u9805\u5c07\u52d5\u614b\u751f\u6210 -->\n        <\/div>\n      <\/div>\n    <\/div>\n    \n    <!-- \u5c0e\u822a\u6309\u9215 -->\n    <div class=\"text-center\">\n      <button class=\"btn btn-outline-secondary px-4 py-2 rounded-pill\" \n              id=\"prevButton9\" onclick=\"quizManager9.previousQuestion()\" style=\"display: none;\">\n        <i class=\"bi bi-arrow-left me-2\"><\/i>\u4e0a\u4e00\u9898\n      <\/button>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- \u7d50\u679c\u9801 -->\n<section id=\"quizresult9\" data-page=\"result9\" class=\"quiz-section d-none py-5\">\n  <div class=\"quiz-container\">\n    <!-- \u7d50\u679c\u6a19\u984c -->\n    <div class=\"text-center mb-5\">\n      <div class=\"icon-wrapper mx-auto mb-4\">\n        <i id=\"resultIcon9\" class=\"bi bi-stars text-white display-4\"><\/i>\n      <\/div>\n      <h2 class=\"display-6 fw-bold mb-3 text-primary-custom\" id=\"resultTitle9\"><\/h2>\n      <p class=\"lead text-muted\" id=\"resultSubtitle9\"><\/p>\n    <\/div>\n    \n    <!-- \u5716\u8868\u548c\u5206\u6790 -->\n    <div class=\"row g-4 mb-5\">\n      <div class=\"col-md-6\">\n        <div class=\"card border-0 shadow-soft h-100\">\n          <div class=\"card-body p-4\">\n            <h4 class=\"fw-bold mb-4 text-center text-primary-custom\">\u59b3\u7684\u611b\u60c5\u7279\u8cea\u5206\u6790<\/h4>\n            <div class=\"chart-container\" style=\"position: relative; height: 280px;\">\n              <canvas id=\"loveChart9\"><\/canvas>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"col-md-6\">\n        <div class=\"card border-0 shadow-soft h-100\">\n          <div class=\"card-body p-4\">\n            <h4 class=\"fw-bold mb-4 text-primary-custom\">\u8be6\u7ec6\u89e3\u6790<\/h4>\n            <div id=\"resultDescription9\" class=\"text-muted lh-lg\"><\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n    \n    <!-- \u5176\u4ed6\u7d50\u679c\u9810\u89bd -->\n    <div class=\"mb-5\">\n      <h4 class=\"text-center mb-4 text-primary-custom\">\u5176\u4ed6\u53ef\u80fd\u7684\u7d50\u679c<\/h4>\n      <div class=\"row g-3\">\n        <div class=\"col-6 col-md-3\">\n          <div class=\"card border-0 shadow-soft\">\n            <div class=\"card-body text-center py-3\">\n              <i class=\"bi bi-gem text-accent mb-2 fs-4\"><\/i>\n              <h6 class=\"mb-0 small\">\u624b\u5fc3\u7684\u5bf6<\/h6>\n            <\/div>\n          <\/div>\n        <\/div>\n        <div class=\"col-6 col-md-3\">\n          <div class=\"card border-0 shadow-soft\">\n            <div class=\"card-body text-center py-3\">\n              <i class=\"bi bi-chat-heart text-accent mb-2 fs-4\"><\/i>\n              <h6 class=\"mb-0 small\">\u5634\u908a\u7684\u5bf6<\/h6>\n            <\/div>\n          <\/div>\n        <\/div>\n        <div class=\"col-6 col-md-3\">\n          <div class=\"card border-0 shadow-soft\">\n            <div class=\"card-body text-center py-3\">\n              <i class=\"bi bi-heart text-accent mb-2 fs-4\"><\/i>\n              <h6 class=\"mb-0 small\">\u5fc3\u4e2d\u7684\u5bf6<\/h6>\n            <\/div>\n          <\/div>\n        <\/div>\n        <div class=\"col-6 col-md-3\">\n          <div class=\"card border-0 shadow-soft\">\n            <div class=\"card-body text-center py-3\">\n              <i class=\"bi bi-flower3 text-accent mb-2 fs-4\"><\/i>\n              <h6 class=\"mb-0 small\">\u773c\u4e2d\u7684\u8349<\/h6>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n    \n    <!-- \u91cd\u65b0\u6e2c\u9a57\u6309\u9215 -->\n    <div class=\"text-center\">\n      <button class=\"btn btn-primary-custom btn-lg px-5 py-3 rounded-pill shadow-soft hover-lift\" \n              onclick=\"quizManager9.resetQuiz()\">\n        <i class=\"bi bi-arrow-clockwise me-2\"><\/i>\u91cd\u65b0\u6d4b\u9a8c\n      <\/button>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- CSS \u6a23\u5f0f -->\n<style>\n  \/* \u5bb9\u5668\u9650\u5236\u6700\u5927\u5bec\u5ea6 *\/\n  .quiz-container {\n    max-width: 750px;\n    margin: 0 auto;\n    padding: 0 15px;\n  }\n  \n  .quiz-section {\n    font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n    font-size: 16px;\n    line-height: 1.6;\n  }\n  \n  \/* \u8212\u7de9\u7642\u7652\u7684\u914d\u8272\u65b9\u6848 - \u9752\u7da0\u8272\u7cfb *\/\n  :root {\n    --primary-color: #4a9b8e;  \/* \u67d4\u548c\u9752\u7da0\u8272 *\/\n    --primary-light: #6fb3a5;\n    --primary-dark: #357a6d;\n    --accent-color: #7db8a8;\n    --soft-gray: #6c757d;\n    --light-bg: #f8fffe;\n    --card-shadow: 0 4px 12px rgba(74, 155, 142, 0.08);\n    --hover-shadow: 0 6px 20px rgba(74, 155, 142, 0.12);\n  }\n  \n  \/* \u6587\u5b57\u984f\u8272 *\/\n  .text-primary-custom {\n    color: var(--primary-color) !important;\n  }\n  \n  .text-accent {\n    color: var(--accent-color) !important;\n  }\n  \n  \/* \u6309\u9215\u6a23\u5f0f *\/\n  .btn-primary-custom {\n    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-light) 100%);\n    border: none;\n    color: white;\n    font-weight: 600;\n    transition: all 0.3s ease;\n  }\n  \n  .btn-primary-custom:hover {\n    background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary-color) 100%);\n    transform: translateY(-2px);\n    box-shadow: var(--hover-shadow);\n    color: white;\n  }\n  \n  \/* \u9032\u5ea6\u689d *\/\n  .progress {\n    background-color: #e8f5f2;\n  }\n  \n  .progress-bar-custom {\n    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-light) 100%);\n  }\n  \n  \/* \u5fbd\u7ae0 *\/\n  .badge-custom {\n    background-color: var(--primary-light);\n    color: white;\n  }\n  \n  \/* \u5716\u6a19\u5305\u88dd\u5668 *\/\n  .icon-wrapper {\n    width: 90px;\n    height: 90px;\n    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-light) 100%);\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    box-shadow: var(--card-shadow);\n    animation: gentle-pulse 3s infinite;\n  }\n  \n  @keyframes gentle-pulse {\n    0%, 100% {\n      transform: scale(1);\n      box-shadow: var(--card-shadow);\n    }\n    50% {\n      transform: scale(1.05);\n      box-shadow: var(--hover-shadow);\n    }\n  }\n  \n  \/* \u6d6e\u52d5\u5713\u5f62\u80cc\u666f *\/\n  .floating-circle {\n    position: absolute;\n    border-radius: 50%;\n    opacity: 0.06;\n    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);\n    animation: gentle-float 20s infinite ease-in-out;\n  }\n  \n  .circle-1 {\n    width: 180px;\n    height: 180px;\n    top: -40px;\n    left: -40px;\n  }\n  \n  .circle-2 {\n    width: 140px;\n    height: 140px;\n    bottom: -20px;\n    right: -20px;\n    animation-delay: -5s;\n  }\n  \n  .circle-3 {\n    width: 100px;\n    height: 100px;\n    top: 50%;\n    left: 70%;\n    animation-delay: -10s;\n  }\n  \n  @keyframes gentle-float {\n    0%, 100% {\n      transform: translateY(0) translateX(0);\n    }\n    33% {\n      transform: translateY(-15px) translateX(10px);\n    }\n    66% {\n      transform: translateY(15px) translateX(-10px);\n    }\n  }\n  \n  \/* \u5361\u7247\u9670\u5f71 *\/\n  .shadow-soft {\n    box-shadow: var(--card-shadow) !important;\n  }\n  \n  .shadow-soft:hover {\n    box-shadow: var(--hover-shadow) !important;\n  }\n  \n  \/* \u984c\u76ee\u6a23\u5f0f *\/\n  .question-title {\n    font-size: 22px !important;\n    font-weight: bold !important;\n    color: var(--primary-dark);\n  }\n  \n  \/* \u9078\u9805\u5361\u7247\u6a23\u5f0f *\/\n  .option-card {\n    background: white;\n    border: 2px solid #e8f5f2;\n    border-radius: 12px;\n    padding: 18px 20px;\n    cursor: pointer;\n    transition: all 0.3s ease;\n    display: flex;\n    align-items: center;\n    gap: 15px;\n    font-size: 18px !important;\n    box-shadow: var(--card-shadow);\n  }\n  \n  .option-card:hover {\n    border-color: var(--primary-light);\n    background: linear-gradient(to right, rgba(74, 155, 142, 0.03), rgba(125, 184, 168, 0.03));\n    transform: translateX(5px);\n    box-shadow: var(--hover-shadow);\n  }\n  \n  .option-card.selected {\n    border-color: var(--primary-color);\n    background: linear-gradient(to right, rgba(74, 155, 142, 0.08), rgba(125, 184, 168, 0.08));\n  }\n  \n  .option-indicator {\n    width: 24px;\n    height: 24px;\n    border: 2px solid #d1e7dd;\n    border-radius: 50%;\n    flex-shrink: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.3s ease;\n  }\n  \n  .option-card:hover .option-indicator {\n    border-color: var(--primary-light);\n  }\n  \n  .option-card.selected .option-indicator {\n    background: var(--primary-color);\n    border-color: var(--primary-color);\n  }\n  \n  .option-card.selected .option-indicator::after {\n    content: \"\u2713\";\n    color: white;\n    font-size: 14px;\n  }\n  \n  \/* \u61f8\u505c\u63d0\u5347\u6548\u679c *\/\n  .hover-lift {\n    transition: all 0.3s ease;\n  }\n  \n  .hover-lift:hover {\n    transform: translateY(-3px);\n  }\n  \n  \/* \u5716\u8868\u5bb9\u5668 *\/\n  .chart-container {\n    position: relative;\n    height: 280px;\n    width: 100%;\n  }\n  \n  \/* \u97ff\u61c9\u5f0f\u8abf\u6574 *\/\n  @media (max-width: 768px) {\n    .display-5 {\n      font-size: 1.75rem;\n    }\n    \n    .display-6 {\n      font-size: 1.5rem;\n    }\n    \n    .question-title {\n      font-size: 20px !important;\n    }\n    \n    .option-card {\n      font-size: 16px !important;\n      padding: 15px 18px;\n    }\n    \n    .icon-wrapper {\n      width: 80px;\n      height: 80px;\n    }\n    \n    .floating-circle {\n      display: none;\n    }\n  }\n  \n  \/* \u78ba\u4fdd\u5361\u7247\u7121\u80cc\u666f\u8272 *\/\n  .card {\n    background-color: white;\n  }\n  \n  \/* \u512a\u5316\u6309\u9215\u9ede\u64ca\u5340\u57df *\/\n  .btn {\n    min-height: 44px;\n    min-width: 44px;\n  }\n<\/style>\n\n<!-- JavaScript -->\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 LoveQuizManager {\n    constructor() {\n      this.currentQuestion = 0;\n      this.answers = {};\n      this.chartInstance = null;\n      \n      \/\/ \u6e2c\u9a57\u984c\u76ee\u548c\u908f\u8f2f\n      this.questions = [\n        {\n          id: 1,\n          text: \"\u59b3\u6700\u8fd1\u534a\u5e74\u76f8\u904e\u4e00\u6b21\u4ee5\u4e0a\u7684\u89aa\u55ce\uff1f\",\n          options: [\n            { text: \"\u662f\u7684\", next: 2 },\n            { text: \"\u6c92\u76f8\u904e\", next: 3 },\n            { text: \"\u525b\u597d\u76f8\u4e00\u6b21\", next: 4 }\n          ]\n        },\n        {\n          id: 2,\n          text: \"\u59b3\u5728\u7236\u6bcd\u8ddf\u524d\uff0c\u662f\u6bd4\u8f03\u4efb\u6027\u4e00\u4e9b\u7684\u55ce\uff1f\",\n          options: [\n            { text: \"\u662f\u7684\", next: 3 },\n            { text: \"\u4e0d\u662f\", next: 4 },\n            { text: \"\u4e00\u822c\", next: 5 }\n          ]\n        },\n        {\n          id: 3,\n          text: \"\u751f\u6d3b\u4e2d\u59b3\u662f\u7279\u5225\u6a02\u89c0\u7a4d\u6975\u7684\u985e\u578b\u55ce\uff1f\",\n          options: [\n            { text: \"\u662f\u7684\", next: 4 },\n            { text: \"\u4e0d\u662f\", next: 5 },\n            { text: \"\u4e00\u822c\", next: 6 }\n          ]\n        },\n        {\n          id: 4,\n          text: \"\u684c\u5b50\u4e0a\u7684\u7897\u4e2d\u6709\u767d\u8272\u5c0f\u9846\u7c92\u72c0\u7684\u7269\u9ad4\uff0c\u59b3\u76f4\u89ba\u4e0a\u8a8d\u70ba\u90a3\u662f\uff1f\",\n          options: [\n            { text: \"\u9e7d\", next: 5 },\n            { text: \"\u7cd6\", next: 6 },\n            { text: \"\u5176\u4ed6\", next: 7 }\n          ]\n        },\n        {\n          id: 5,\n          text: \"\u5c0d\u65bc\u4e0d\u559c\u6b61\u7684\u4eba\uff0c\u59b3\u73fe\u5728\u662f\u679c\u65b7\u6703\u62d2\u7d55\u4e86\u55ce\uff1f\",\n          options: [\n            { text: \"\u662f\u7684\", next: 6 },\n            { text: \"\u4e0d\u662f\", next: 7 },\n            { text: \"\u770b\u60c5\u6cc1\", next: 8 }\n          ]\n        },\n        {\n          id: 6,\n          text: \"\u4e0b\u9762\u5e7e\u7a2e\u8fa3\u6912\uff0c\u5b83\u7684\u540d\u5b57\u59b3\u6700\u559c\u6b61\u7684\u662f\uff1f\",\n          options: [\n            { text: \"\u9752\u6912\", next: 7 },\n            { text: \"\u82b1\u6912\", next: 8 },\n            { text: \"\u71c8\u7c60\u6912\", result: \"A\" }\n          ]\n        },\n        {\n          id: 7,\n          text: \"\u8ddf\u4eba\u7d04\u4e86\u6642\u9593\u898b\u9762\uff0c\u59b3\u901a\u5e38\u6703\uff1f\",\n          options: [\n            { text: \"\u65e9\u5230\", next: 8 },\n            { text: \"\u665a\u5230\", next: 9 },\n            { text: \"\u525b\u597d\u5230\", next: 10 }\n          ]\n        },\n        {\n          id: 8,\n          text: \"\u5982\u679c\u559c\u6b61\u7684\u4eba\u8207\u59b3\u4e00\u76f4\u6696\u6627\uff0c\u59b3\u6703\uff1f\",\n          options: [\n            { text: \"\u6293\u72c2\", next: 9 },\n            { text: \"\u4eab\u53d7\", result: \"A\" },\n            { text: \"\u7cfe\u7d50\", result: \"B\" }\n          ]\n        },\n        {\n          id: 9,\n          text: \"\u5206\u624b\u5f8c\uff0c\u4e0b\u9762\u4e09\u7a2e\u9152\uff0c\u59b3\u6703\u9078\u64c7\u54ea\u7a2e\u4f86\u559d\uff1f\",\n          options: [\n            { text: \"\u5a01\u58eb\u5fcc\", result: \"C\" },\n            { text: \"\u8461\u8404\u9152\", result: \"D\" },\n            { text: \"\u9999\u6ab3\", result: \"A\" }\n          ]\n        },\n        {\n          id: 10,\n          text: \"\u8ddf\u8001\u516c\u7d50\u5a5a\u7d00\u5ff5\u65e5\u5403\u5927\u9910\uff0c\u59b3\u5e0c\u671b\u9910\u5ef3\u6709\u4eba\u73fe\u5834\u6f14\u594f\u54ea\u7a2e\u97f3\u6a02\uff1f\",\n          options: [\n            { text: \"\u53e4\u7434\", result: \"B\" },\n            { text: \"\u92fc\u7434\", result: \"C\" },\n            { text: \"\u5c0f\u63d0\u7434\", result: \"D\" }\n          ]\n        }\n      ];\n      \n      \/\/ \u7d50\u679c\u63cf\u8ff0\n      this.results = {\n        A: {\n          title: \"\u624b\u5fc3\u7684\u5bf6\",\n          subtitle: \"\u59b3\u662f\u4ed6\u638c\u4e2d\u7684\u73cd\u5bf6\",\n          icon: \"bi-gem\",\n          description: \"\u7d50\u5a5a\u4e4b\u5f8c\uff0c\u59b3\u6709\u5e0c\u671b\u88ab\u8001\u516c\u6367\u5728\u624b\u5fc3\u88e1\uff0c\u59b3\u662f\u4ed6\u7684\u638c\u4e2d\u73e0\u5bf6\uff0c\u662f\u8981\u5c0f\u5fc3\u5475\u8b77\u7684\u3002\u6709\u7684\u4eba\u89ba\u5f97\u59b3\u9019\u9ebc\u5e78\u904b\uff0c\u80fd\u5ac1\u4e00\u500b\u9019\u9ebc\u597d\u7684\u8001\u516c\uff0c\u80fd\u5c0d\u59b3\u9019\u9ebc\u597d\u3002\u5176\u5be6\u59b3\u660e\u767d\uff0c\u90a3\u662f\u56e0\u70ba\u81ea\u5df1\u503c\u5f97\u9019\u6a23\u7684\u5c0d\u5f85\uff0c\u59b3\u7368\u7acb\u5927\u65b9\uff0c\u59b3\u5bb6\u4e2d\u5167\u5916\u90fd\u6253\u9ede\u597d\uff0c\u9019\u6a23\u7684\u59b3\uff0c\u5982\u679c\u8001\u516c\u628a\u59b3\u7576\u6210\u4e00\u6839\u8349\uff0c\u59b3\u4e00\u5b9a\u53eb\u4ed6\u5f8c\u6094\u83ab\u53ca\u3002\",\n          chartData: {\n            labels: ['\u88ab\u5bf5\u611b\u7a0b\u5ea6', '\u7368\u7acb\u6027', '\u5bb6\u5ead\u8ca2\u737b', '\u500b\u4eba\u9b45\u529b', '\u5e78\u798f\u611f'],\n            data: [95, 90, 92, 88, 96]\n          }\n        },\n        B: {\n          title: \"\u5634\u908a\u7684\u5bf6\",\n          subtitle: \"\u751c\u8a00\u871c\u8a9e\u7684\u611b\u60c5\",\n          icon: \"bi-chat-heart\",\n          description: \"\u59b3\u672c\u8eab\u4e5f\u662f\u4e0d\u932f\u7684\uff0c\u5948\u4f55\u672a\u4f86\u7684\u8001\u516c\u53ea\u628a\u59b3\u639b\u5728\u5634\u908a\uff0c\u5634\u4e0a\u6703\u8aaa\u9ede\u5152\u751c\u8a00\u871c\u8a9e\uff0c\u6703\u54c4\u8457\u59b3\uff0c\u628a\u59b3\u7576\u6210\u5bf6\u8c9d\uff0c\u4f46\u662f\u5be6\u969b\u884c\u52d5\u537b\u6c92\u6709\u3002\u771f\u7684\u8981\u4ed6\u62ff\u51fa\u771f\u91d1\u767d\u9280\u4f86\u54c4\u59b3\u958b\u5fc3\u4e86\uff0c\u4ed6\u53ef\u80fd\u5c31\u616b\u4e86\uff0c\u53ef\u80fd\u5c31\u6703\u7cfe\u7d50\u8207\u7336\u8c6b\u4e86\u3002\u8b93\u4ed6\u505a\u9ede\u5152\u5bb6\u52d9\uff0c\u53ef\u80fd\u4e5f\u6703\u5527\u5527\u6b6a\u6b6a\u7684\u3002\u5e78\u597d\u59b3\u611b\u4ed6\uff0c\u4ed6\u4e5f\u81f3\u5c11\u5634\u4e0a\u6703\u54c4\u4eba\uff0c\u5426\u5247\u59b3\u904e\u4e0d\u4e0b\u53bb\u3002\",\n          chartData: {\n            labels: ['\u88ab\u5bf5\u611b\u7a0b\u5ea6', '\u7368\u7acb\u6027', '\u5bb6\u5ead\u8ca2\u737b', '\u500b\u4eba\u9b45\u529b', '\u5e78\u798f\u611f'],\n            data: [65, 75, 85, 80, 70]\n          }\n        },\n        C: {\n          title: \"\u5fc3\u4e2d\u7684\u5bf6\",\n          subtitle: \"\u6df1\u85cf\u5fc3\u5e95\u7684\u771f\u611b\",\n          icon: \"bi-heart\",\n          description: \"\u53ef\u80fd\u6709\u7684\u7537\u4eba\u5c31\u9019\u6a23\u5566\uff0c\u4e0d\u6703\u6642\u6642\u523b\u523b\u628a\u59b3\u6367\u5728\u624b\u5fc3\u88e1\uff0c\u4e0d\u6703\u6642\u4e0d\u6642\u5730\u628a\u59b3\u639b\u5728\u5634\u908a\uff0c\u8aaa\u8457\u751c\u8a00\u871c\u8a9e\uff0c\u4f46\u662f\u4ed6\u5011\u611b\u4e00\u500b\u4eba\uff0c\u6703\u628a\u5c0d\u65b9\u653e\u5728\u5fc3\u4e2d\uff0c\u5728\u59b3\u9700\u8981\u4ed6\u7684\u6642\u5019\uff0c\u4ed6\u6703\u4e00\u8072\u4e0d\u542d\u5730\u51fa\u73fe\uff0c\u5e6b\u59b3\u89e3\u6c7a\u6240\u6709\u7684\u554f\u984c\u3002\u800c\u59b3\u771f\u7684\u5f88\u5e78\u904b\uff0c\u80fd\u5ac1\u4e00\u500b\u9019\u6a23\u7684\u597d\u8001\u516c\uff0c\u5728\u5fc3\u4e2d\uff0c\u59b3\u662f\u4ed6\u7368\u4e00\u7121\u4e8c\u7684\u5927\u5bf6\u8c9d\u3002\",\n          chartData: {\n            labels: ['\u88ab\u5bf5\u611b\u7a0b\u5ea6', '\u7368\u7acb\u6027', '\u5bb6\u5ead\u8ca2\u737b', '\u500b\u4eba\u9b45\u529b', '\u5e78\u798f\u611f'],\n            data: [85, 80, 78, 82, 88]\n          }\n        },\n        D: {\n          title: \"\u773c\u4e2d\u7684\u8349\",\n          subtitle: \"\u7b49\u5f85\u7dbb\u653e\u7684\u5805\u97cc\",\n          icon: \"bi-flower3\",\n          description: \"\u4e0d\u77e5\u9053\u662f\u59b3\u547d\u82e6\u9084\u662f\u600e\u9ebc\u6a23\uff0c\u59b3\u7684\u5a5a\u59fb\u6c92\u6709\u90a3\u9ebc\u5e78\u904b\uff0c\u4e5f\u6c92\u6709\u60f3\u8c61\u4e2d\u7684\u90a3\u6a23\u5e78\u798f\u3002\u59b3\u5728\u8001\u516c\u7684\u773c\u4e2d\uff0c\u53ea\u662f\u4e00\u6839\u8349\u3002\u53ef\u80fd\u4ed6\u662f\u5c0d\u59b3\u4e0d\u6eff\u610f\uff0c\u4f46\u662f\u59b3\u4e5f\u5f9e\u4f86\u4e0d\u6703\u56e0\u6b64\u5c31\u770b\u8f15\u81ea\u5df1\uff0c\u4f46\u662f\u8349\u662f\u6709\u9811\u5f37\u751f\u547d\u529b\u7684\uff0c\u5982\u679c\u4ed6\u4e00\u76f4\u628a\u59b3\u7576\u6210\u666e\u901a\u91ce\u8349\uff0c\u90a3\u9ebc\u59b3\u6703\u6beb\u4e0d\u7336\u8c6b\u5730\u96e2\u958b\uff0c\u4e26\u4e14\u6d3b\u6210\u4e00\u68f5\u7368\u4e00\u7121\u4e8c\u7684\u85e5\u8349\u3001\u9999\u8349\u3002\",\n          chartData: {\n            labels: ['\u88ab\u5bf5\u611b\u7a0b\u5ea6', '\u7368\u7acb\u6027', '\u5bb6\u5ead\u8ca2\u737b', '\u500b\u4eba\u9b45\u529b', '\u5e78\u798f\u611f'],\n            data: [45, 95, 70, 75, 60]\n          }\n        }\n      };\n      \n      this.init();\n    }\n    \n    init() {\n      \/\/ \u7de9\u5b58DOM\u5143\u7d20\n      this.introSection = document.getElementById('quizintro9');\n      this.quizSection = document.getElementById('quizmain9');\n      this.resultSection = document.getElementById('quizresult9');\n      this.questionTitle = document.getElementById('questionTitle9');\n      this.optionsContainer = document.getElementById('optionsContainer9');\n      this.progressBar = document.getElementById('progressBar9');\n      this.questionCounter = document.getElementById('questionCounter9');\n      this.prevButton = document.getElementById('prevButton9');\n    }\n    \n    startQuiz() {\n      this.currentQuestion = 1;\n      this.answers = {};\n      this.showSection('quiz');\n      this.displayQuestion();\n    }\n    \n    displayQuestion() {\n      const question = this.questions.find(q => q.id === this.currentQuestion);\n      if (!question) return;\n      \n      \/\/ \u66f4\u65b0\u984c\u76ee\n      this.questionTitle.textContent = question.text;\n      \n      \/\/ \u66f4\u65b0\u9032\u5ea6\n      const actualQuestionNumber = Object.keys(this.answers).length + 1;\n      this.questionCounter.textContent = `\u554f\u984c ${actualQuestionNumber}\/10`;\n      this.progressBar.style.width = `${actualQuestionNumber * 10}%`;\n      \n      \/\/ \u986f\u793a\/\u96b1\u85cf\u4e0a\u4e00\u984c\u6309\u9215\n      this.prevButton.style.display = Object.keys(this.answers).length > 0 ? 'inline-block' : 'none';\n      \n      \/\/ \u751f\u6210\u9078\u9805\n      this.optionsContainer.innerHTML = '';\n      question.options.forEach((option, index) => {\n        const optionElement = document.createElement('div');\n        optionElement.className = 'option-card';\n        optionElement.innerHTML = `\n          <div class=\"option-indicator\"><\/div>\n          <div class=\"flex-grow-1\">${option.text}<\/div>\n        `;\n        optionElement.addEventListener('click', () => this.selectAnswer(option));\n        this.optionsContainer.appendChild(optionElement);\n      });\n    }\n    \n    selectAnswer(option) {\n      \/\/ \u4fdd\u5b58\u7b54\u6848\n      this.answers[this.currentQuestion] = option;\n      \n      \/\/ \u8996\u89ba\u53cd\u994b\n      const cards = this.optionsContainer.querySelectorAll('.option-card');\n      cards.forEach(card => card.classList.remove('selected'));\n      event.currentTarget.classList.add('selected');\n      \n      \/\/ \u5ef6\u9072\u5f8c\u9032\u5165\u4e0b\u4e00\u984c\u6216\u986f\u793a\u7d50\u679c\n      setTimeout(() => {\n        if (option.result) {\n          this.showResult(option.result);\n        } else if (option.next) {\n          this.currentQuestion = option.next;\n          this.displayQuestion();\n        }\n      }, 300);\n    }\n    \n    previousQuestion() {\n      const answeredQuestions = Object.keys(this.answers).map(Number).sort((a, b) => a - b);\n      if (answeredQuestions.length === 0) return;\n      \n      const lastAnswered = answeredQuestions[answeredQuestions.length - 1];\n      delete this.answers[lastAnswered];\n      this.currentQuestion = lastAnswered;\n      this.displayQuestion();\n    }\n    \n    showResult(resultKey) {\n      const result = this.results[resultKey];\n      if (!result) return;\n      \n      \/\/ \u92b7\u6bc0\u820a\u5716\u8868\n      if (this.chartInstance) {\n        this.chartInstance.destroy();\n        this.chartInstance = null;\n      }\n      \n      \/\/ \u66f4\u65b0\u7d50\u679c\u9801\u5167\u5bb9\n      document.getElementById('resultTitle9').textContent = result.title;\n      document.getElementById('resultSubtitle9').textContent = result.subtitle;\n      document.getElementById('resultIcon9').className = `${result.icon} text-white display-4`;\n      document.getElementById('resultDescription9').innerHTML = result.description;\n      \n      \/\/ \u986f\u793a\u7d50\u679c\u9801\n      this.showSection('result');\n      \n      \/\/ \u5ef6\u9072\u5275\u5efa\u5716\u8868\u4ee5\u78ba\u4fdd\u5bb9\u5668\u53ef\u898b\n      setTimeout(() => this.createChart(result.chartData), 100);\n    }\n    \n    createChart(data) {\n      const ctx = document.getElementById('loveChart9').getContext('2d');\n      \n      \/\/ \u8212\u7de9\u7684\u9752\u7da0\u8272\u7cfb\u914d\u8272\n      this.chartInstance = new Chart(ctx, {\n        type: 'radar',\n        data: {\n          labels: data.labels,\n          datasets: [{\n            label: '\u59b3\u7684\u7279\u8cea\u5206\u6790',\n            data: data.data,\n            backgroundColor: 'rgba(74, 155, 142, 0.15)',\n            borderColor: 'rgba(74, 155, 142, 0.8)',\n            borderWidth: 2,\n            pointBackgroundColor: 'rgba(74, 155, 142, 1)',\n            pointBorderColor: '#fff',\n            pointHoverBackgroundColor: '#fff',\n            pointHoverBorderColor: 'rgba(74, 155, 142, 1)',\n            pointRadius: 4,\n            pointHoverRadius: 6\n          }]\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: false,\n          plugins: {\n            legend: {\n              display: false\n            }\n          },\n          scales: {\n            r: {\n              beginAtZero: true,\n              max: 100,\n              ticks: {\n                font: {\n                  size: 12\n                },\n                color: '#6c757d'\n              },\n              pointLabels: {\n                font: {\n                  size: 14\n                },\n                color: '#4a9b8e'\n              },\n              grid: {\n                color: 'rgba(74, 155, 142, 0.1)'\n              }\n            }\n          }\n        }\n      });\n    }\n    \n    showSection(section) {\n      \/\/ \u96b1\u85cf\u6240\u6709\u5340\u6bb5\n      this.introSection.classList.add('d-none');\n      this.quizSection.classList.add('d-none');\n      this.resultSection.classList.add('d-none');\n      \n      \/\/ \u986f\u793a\u6307\u5b9a\u5340\u6bb5\n      switch(section) {\n        case 'intro':\n          this.introSection.classList.remove('d-none');\n          break;\n        case 'quiz':\n          this.quizSection.classList.remove('d-none');\n          break;\n        case 'result':\n          this.resultSection.classList.remove('d-none');\n          break;\n      }\n      \n      \/\/ \u6efe\u52d5\u5230\u9802\u90e8\n      window.scrollTo({ top: 0, behavior: 'smooth' });\n    }\n    \n    resetQuiz() {\n      \/\/ \u92b7\u6bc0\u5716\u8868\n      if (this.chartInstance) {\n        this.chartInstance.destroy();\n        this.chartInstance = null;\n      }\n      \n      \/\/ \u91cd\u7f6e\u72c0\u614b\n      this.currentQuestion = 1;\n      this.answers = {};\n      \n      \/\/ \u8fd4\u56de\u5f15\u5c0e\u9801\n      this.showSection('intro');\n    }\n  }\n  \n  \/\/ \u5275\u5efa\u5168\u5c40\u5be6\u4f8b\n  window.quizManager9 = new LoveQuizManager();\n})();\n<\/script>","protected":false},"excerpt":{"rendered":"<p>\u5973\u5b69\u5b50\u5e0c\u671b\u80fd\u88ab\u8001\u516c\u5f53\u6210\u624b\u5fc3\u91cc\u7684\u5b9d\uff0c\u8981\u5ba0\u7740\u7231\u7740\u7684\uff0c\u4f46\u662f\u4e0d\u89c1\u5f97\u6240\u6709\u4eba\u90fd\u4f1a\u5982\u613f\uff0c\u6709\u7684\u5973\u6027\u672c\u8eab\u5584\u826f\u6e29\u548c\uff0c\u5374\u88ab\u8001\u516c\u5acc\u5f03\uff0c\u5f53\u6210\u91ce\u8349\u3002\u4e0d\u77e5\u4f60\u4f1a\u5982\u4f55\uff1f<\/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-2459","post","type-post","status-publish","format-standard","hentry","category-marriage","category-love"],"_links":{"self":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2459","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=2459"}],"version-history":[{"count":1,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2459\/revisions"}],"predecessor-version":[{"id":10638,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2459\/revisions\/10638"}],"wp:attachment":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/media?parent=2459"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/categories?post=2459"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/tags?post=2459"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}