{"id":83,"date":"2025-06-13T15:45:12","date_gmt":"2025-06-13T07:45:12","guid":{"rendered":"https:\/\/beta-new.inhand.com\/?page_id=83"},"modified":"2025-11-04T00:59:23","modified_gmt":"2025-11-04T00:59:23","slug":"product-compare","status":"publish","type":"page","link":"https:\/\/www.inhand.com\/zh\/product-compare","title":{"rendered":"product-compare"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"83\" class=\"elementor elementor-83\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e1cd471 e-con-full e-flex e-con e-parent\" data-id=\"e1cd471\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-259895b elementor-widget__width-inherit elementor-widget elementor-widget-shortcode\" data-id=\"259895b\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">  <div class=\"compare_devices_page\">\n    <!-- \u5934\u90e8 -->\n    <div class=\"compare_devices_header\">\n      <h1 class=\"compare_devices_title\">COMPARE DEVICES<\/h1>\n      <p class=\"compare_devices_subtitle\">Select up to 4 products<\/p>\n    <\/div>\n\n    <!-- \u63a7\u5236\u533a -->\n    <div class=\"compare_devices_controls\">\n      <div class=\"compare_devices_left\">\n        <button class=\"compare_devices_download_btn\" id=\"downloadBtnInline\" style=\"border:none; padding:0 15px; cursor:pointer; box-shadow:none; display:flex; align-items:center; justify-content:center; gap:8px; height:44px; background:#3EB044;\">\n          <img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/01\/\u4e0b\u8f7d-copy-2.png\" alt=\"Download\" style=\"width:20px; display:block;\">\n          <span style=\"font-size:14px; font-weight:600; color:#fff;\">Download result<\/span>\n        <\/button>\n      <\/div>\n\n      <div class=\"compare_devices_selectors\">\n        <select class=\"compare_devices_select\" id=\"product1\">\n          <option value=\"\">Select a product<\/option>\n        <\/select>\n        <select class=\"compare_devices_select\" id=\"product2\">\n          <option value=\"\">Select a product<\/option>\n        <\/select>\n        <select class=\"compare_devices_select\" id=\"product3\">\n          <option value=\"\">Select a product<\/option>\n        <\/select>\n        <select class=\"compare_devices_select\" id=\"product4\">\n          <option value=\"\">Select a product<\/option>\n        <\/select>\n      <\/div>\n    <\/div>\n\n\n\n    <!-- \u4ea7\u54c1\u5361\u7247\u533a -->\n    <div class=\"compare_devices_products\" id=\"productCards\"><\/div>\n\n    <!-- \u5c5e\u6027\u5bf9\u6bd4\u533a -->\n    <div class=\"compare_devices_attributes\" id=\"attributesArea\"><\/div>\n\n    <!-- \u5bfc\u51fa\u5f39\u7a97 -->\n    <div class=\"compare_devices_modal\" id=\"exportModal\">\n      <div class=\"compare_devices_modal_content\">\n        <div class=\"compare_devices_modal_header\">\n          <h3>Select export format<\/h3>\n          <button class=\"compare_devices_modal_close\" id=\"closeModal\">&times;<\/button>\n        <\/div>\n        <div class=\"compare_devices_modal_body\">\n          <button class=\"compare_devices_export_btn\" data-format=\"pdf\">\n            <span>\ud83d\udcc4<\/span> Export as PDF\n          <\/button>\n          <button class=\"compare_devices_export_btn\" data-format=\"excel\">\n            <span>\ud83d\udcca<\/span> Export as Excel\n          <\/button>\n          <button class=\"compare_devices_export_btn\" data-format=\"csv\">\n            <span>\ud83d\udccb<\/span> Export as CSV\n          <\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u52a0\u8f7d\u63d0\u793a -->\n    <div class=\"compare_devices_loading\" id=\"loadingIndicator\" style=\"display: none;\">\n      <div class=\"compare_devices_spinner\"><\/div>\n    <\/div>\n  <\/div>\n\n  <script>\n    jQuery(document).ready(function($) {\n      const ajaxUrl = 'https:\/\/www.inhand.com\/wp-admin\/admin-ajax.php';\n      const nonce = 'f3127466ee';\n      let selectedProducts = [];\n      let allProducts = [];\n      let compareData = null;\n\n      init();\n\n      function init() {\n        const stored = localStorage.getItem('compareProducts');\n        if (stored) {\n          selectedProducts = JSON.parse(stored).map(id => String(id));\n        }\n        loadProducts();\n        bindEvents();\n      }\n\n      function loadProducts() {\n        $.ajax({\n          url: ajaxUrl,\n          type: 'POST',\n          data: {\n            action: 'get_available_products',\n            security: nonce\n          },\n          success: function(response) {\n            if (response.success) {\n              allProducts = response.data;\n              populateSelects();\n              selectedProducts.forEach((productId, index) => {\n                $('#product' + (index + 1)).val(productId);\n              });\n              \/\/ \t\t\t\t\t\tupdateSelectedProducts(); \/\/ \u6dfb\u52a0\u8fd9\u4e00\u884c\n              if (selectedProducts.length > 0) {\n                loadCompareData();\n              }\n            }\n          }\n        });\n      }\n\n      function populateSelects() {\n        $('.compare_devices_select').each(function() {\n          const $select = $(this);\n          allProducts.forEach(function(product) {\n            $select.append('<option value=\"' + product.id + '\">' + product.name + '<\/option>');\n          });\n        });\n      }\n\n      function bindEvents() {\n        $('.compare_devices_select').on('change', function() {\n          updateSelectedProducts();\n          saveToLocalStorage();\n          loadCompareData();\n        });\n\n        \/\/ $('#downloadBtn').on('click', function() {\n        \/\/     if (selectedProducts.length === 0) {\n        \/\/         alert('\u8bf7\u5148\u9009\u62e9\u4ea7\u54c1');\n        \/\/         return;\n        \/\/     }\n        \/\/     $('#exportModal').fadeIn();\n        \/\/ });\n        \/\/ \u65b0\u589e\uff1a\u5185\u8054\u4e0b\u8f7d\u6309\u94ae\u4e8b\u4ef6\uff08\u4f7f\u7528\u4e8b\u4ef6\u59d4\u6258\uff09\n        $(document).on('click', '#downloadBtnInline', function() {\n          if (selectedProducts.length === 0) {\n            alert('Please select products first');\n            return;\n          }\n          $('#exportModal').fadeIn();\n        });\n        $('#closeModal').on('click', function() {\n          $('#exportModal').fadeOut();\n        });\n\n        $(document).on('click', '.compare_devices_modal', function(e) {\n          if (e.target === this) {\n            $(this).fadeOut();\n          }\n        });\n\n        $('.compare_devices_export_btn').on('click', function() {\n          const format = $(this).data('format');\n          exportData(format);\n          $('#exportModal').fadeOut();\n        });\n\n        $('#showDifferencesOnly').on('change', function() {\n          applyDifferencesFilter();\n        });\n\n        $(document).on('click', '.compare_devices_remove_btn', function() {\n          const productId = $(this).data('product-id');\n          removeProduct(productId);\n        });\n\n        $(document).off('click', '.compare_devices_attr_group_header').on('click', '.compare_devices_attr_group_header', function() {\n          $(this).toggleClass('expanded');\n          $(this).next('.compare_devices_attr_group_content').slideToggle();\n        });\n      }\n\n      function updateSelectedProducts() {\n        selectedProducts = [];\n        $('.compare_devices_select').each(function() {\n          const val = $(this).val();\n          if (val) {\n            selectedProducts.push(val);\n          }\n        });\n      }\n\n      function saveToLocalStorage() {\n        localStorage.setItem('compareProducts', JSON.stringify(selectedProducts));\n      }\n\n      function removeProduct(productId) {\n        $('.compare_devices_select').each(function() {\n          if ($(this).val() == productId) {\n            $(this).val('');\n          }\n        });\n        updateSelectedProducts();\n        saveToLocalStorage();\n        loadCompareData();\n      }\n\n      function loadCompareData() {\n        if (selectedProducts.length === 0) {\n          $('#productCards').html('');\n          $('#attributesArea').html('');\n          return;\n        }\n\n        $('#loadingIndicator').show();\n\n        $.ajax({\n          url: ajaxUrl,\n          type: 'POST',\n          data: {\n            action: 'get_compare_data_json',\n            security: nonce,\n            product_ids: selectedProducts\n          },\n          success: function(response) {\n            if (response.success) {\n              compareData = response.data;\n              renderCompare();\n            }\n            $('#loadingIndicator').hide();\n          },\n          error: function() {\n            $('#productCards').html('<div class=\"compare_devices_error\">\u52a0\u8f7d\u5931\u8d25<\/div>');\n            $('#loadingIndicator').hide();\n          }\n        });\n      }\n\n      function renderCompare() {\n        if (!compareData) return;\n        renderProductCards();\n        renderAttributes();\n      }\n\n      function renderProductCards() {\n        let html = '<div class=\"compare_devices_product_row\">';\n\n        \/\/ \u3010\u6838\u5fc3\u4fee\u6539\u3011\u5728\u4ea7\u54c1\u56fe\u6392\u7684\u6700\u5de6\u4fa7\u63d2\u5165 Show differences \u52fe\u9009\u6846\n        html += '<div class=\"compare_devices_diff_column\">';\n        html += '  <label class=\"compare_devices_checkbox_wrapper\">';\n        html += '    <input type=\"checkbox\" id=\"showDifferencesOnly\">';\n        html += '    <span>Show differences only<\/span>';\n        html += '  <\/label>';\n        html += '<\/div>';\n\n        compareData.products.forEach(function(product) {\n          html += '<div class=\"compare_devices_product_card\">';\n          \/\/         html += '<button class=\"compare_devices_remove_btn\" data-product-id=\"' + product.id + '\">\u00d7<\/button>';\n          if (product.image) {\n            html += '<img decoding=\"async\" src=\"' + product.image + '\" alt=\"' + product.name + '\">';\n          } else {\n            html += '<div class=\"compare_devices_no_image\">\ud83d\udce6<\/div>';\n          }\n          html += '<div class=\"compare_devices_product_name\">' + product.name + '<\/div>';\n          html += '<\/div>';\n        });\n        html += '<\/div>';\n        $('#productCards').html(html);\n        \/\/ \u91cd\u65b0\u7ed1\u5b9a\u52fe\u9009\u6846\u7684\u70b9\u51fb\u4e8b\u4ef6\uff08\u56e0\u4e3a\u662f\u52a8\u6001\u751f\u6210\u7684\uff09\n        $('#showDifferencesOnly').on('change', function() {\n          applyDifferencesFilter();\n        });\n      }\n\n      function renderAttributes() {\n        let html = '';\n        let groupIndex = 0;\n        $.each(compareData.attributes, function(attrName, attrInfo) {\n          const isExpanded = groupIndex < 5;\n          html += '<div class=\"compare_devices_attr_group\">';\n          html += '<div class=\"compare_devices_attr_group_header ' + (isExpanded ? 'expanded' : '') + '\" data-attr=\"' + attrName + '\">';\n          html += '<span class=\"compare_devices_attr_title\">' + attrInfo.label + '<\/span>';\n          html += '<span class=\"compare_devices_arrow\">\u25b2<\/span>';\n          html += '<\/div>';\n          html += '<div class=\"compare_devices_attr_group_content\" style=\"' + (isExpanded ? '' : 'display:none') + '\">';\n          $.each(attrInfo.values, function(valueId, valueName) {\n            html += '<div class=\"compare_devices_attr_row\" data-parent=\"' + attrName + '\">';\n            html += '<div class=\"compare_devices_attr_name\">' + valueName + '<\/div>';\n            compareData.products.forEach(function(product) {\n              const productValue = getProductValue(product.id, attrName, valueId, valueName);\n              html += '<div class=\"compare_devices_attr_value\">' + productValue + '<\/div>';\n            });\n            html += '<\/div>';\n          });\n          html += '<\/div><\/div>';\n          groupIndex++;\n        });\n        $('#attributesArea').html(html);\n        \/\/ \u5207\u6362\u4ea7\u54c1\u540e\uff0c\u5982\u679c\u5df2\u52fe\u9009\"\u53ea\u663e\u793a\u5dee\u5f02\"\uff0c\u81ea\u52a8\u91cd\u65b0\u5e94\u7528\u8fc7\u6ee4\n        if ($('#showDifferencesOnly').is(':checked')) {\n          applyDifferencesFilter();\n        }\n      }\n\n      function getProductValue(productId, attrName, valueId, valueName) {\n        const product = compareData.products.find(p => p.id == productId);\n        if (!product || !product.attribute_values) return '<span class=\"compare_devices_empty\">\u2014<\/span>';\n        const attrValues = product.attribute_values[attrName];\n        if (!attrValues) return '<span class=\"compare_devices_empty\">\u2014<\/span>';\n        const valueData = attrValues[valueId] || attrValues[valueName];\n        if (!valueData) return '<span class=\"compare_devices_empty\">\u2014<\/span>';\n        if (valueData.description) {\n          return valueData.description;\n        } else if (valueData.has_value) {\n          return '<span class=\"compare_devices_check\">\u2713<\/span>';\n        }\n        return '<span class=\"compare_devices_empty\">\u2014<\/span>';\n      }\n\n      function applyDifferencesFilter() {\n        const showDiff = $('#showDifferencesOnly').is(':checked');\n        if (showDiff) {\n          $('.compare_devices_attr_row').each(function() {\n            const $values = $(this).find('.compare_devices_attr_value');\n            if (isRowSame($values)) {\n              $(this).hide();\n            } else {\n              $(this).show();\n            }\n          });\n        } else {\n          $('.compare_devices_attr_row').show();\n        }\n      }\n\n      function isRowSame($values) {\n        if ($values.length === 0) return true;\n        const firstText = $values.first().text().trim();\n        let allSame = true;\n        $values.each(function() {\n          if ($(this).text().trim() !== firstText) {\n            allSame = false;\n            return false;\n          }\n        });\n        return allSame;\n      }\n\n      function exportData(format) {\n        window.location.href = ajaxUrl + '?action=export_comparison&format=' + format + '&product_ids=' + selectedProducts.join(',') + '&security=' + nonce;\n      }\n\n      \/\/ --- \u4fee\u6539 2\uff1a\u6eda\u52a8\u76d1\u542c\u4fdd\u6301\u4e0d\u53d8\uff0c\u53ea\u56fa\u5b9a controls \u6392 ---\n      $(window).off('scroll').on('scroll', function() {\n        var $controls = $('.compare_devices_controls');\n        var $header = $('.compare_devices_header');\n\n        if ($controls.length) {\n          var triggerPoint = $header.offset().top + $header.outerHeight();\n          var scrollTop = $(window).scrollTop();\n\n          if (scrollTop > triggerPoint) {\n            $controls.addClass('fixed');\n            $('body').addClass('hide-navigation');\n          } else {\n            $controls.removeClass('fixed');\n            $('body').removeClass('hide-navigation');\n          }\n        }\n      });\n\n    }); \/\/ jQuery.ready \u7ed3\u675f\n  <\/script>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-83","page","type-page","status-publish","hentry"],"blocksy_meta":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.6 (Yoast SEO v26.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>product-compare - InHand Networks<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.inhand.com\/zh\/product-compare\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"product-compare\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.inhand.com\/zh\/product-compare\" \/>\n<meta property=\"og:site_name\" content=\"InHand Networks\" \/>\n<meta property=\"article:modified_time\" content=\"2025-11-04T00:59:23+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.inhand.com\/zh\/product-compare\",\"url\":\"https:\/\/www.inhand.com\/zh\/product-compare\",\"name\":\"product-compare - InHand Networks\",\"isPartOf\":{\"@id\":\"https:\/\/www.inhand.com\/zh\/#website\"},\"datePublished\":\"2025-06-13T07:45:12+00:00\",\"dateModified\":\"2025-11-04T00:59:23+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.inhand.com\/zh\/product-compare#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.inhand.com\/zh\/product-compare\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.inhand.com\/zh\/product-compare#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.inhand.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"product-compare\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.inhand.com\/zh\/#website\",\"url\":\"https:\/\/www.inhand.com\/zh\/\",\"name\":\"inhand\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.inhand.com\/zh\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.inhand.com\/zh\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.inhand.com\/zh\/#organization\",\"name\":\"inhand\",\"url\":\"https:\/\/www.inhand.com\/zh\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.inhand.com\/zh\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.inhand.com\/wp-content\/uploads\/2025\/10\/LOGO.png\",\"contentUrl\":\"https:\/\/www.inhand.com\/wp-content\/uploads\/2025\/10\/LOGO.png\",\"width\":684,\"height\":120,\"caption\":\"inhand\"},\"image\":{\"@id\":\"https:\/\/www.inhand.com\/zh\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"product-compare - InHand Networks","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.inhand.com\/zh\/product-compare","og_locale":"zh_CN","og_type":"article","og_title":"product-compare","og_url":"https:\/\/www.inhand.com\/zh\/product-compare","og_site_name":"InHand Networks","article_modified_time":"2025-11-04T00:59:23+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.inhand.com\/zh\/product-compare","url":"https:\/\/www.inhand.com\/zh\/product-compare","name":"product-compare - InHand Networks","isPartOf":{"@id":"https:\/\/www.inhand.com\/zh\/#website"},"datePublished":"2025-06-13T07:45:12+00:00","dateModified":"2025-11-04T00:59:23+00:00","breadcrumb":{"@id":"https:\/\/www.inhand.com\/zh\/product-compare#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.inhand.com\/zh\/product-compare"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.inhand.com\/zh\/product-compare#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.inhand.com\/"},{"@type":"ListItem","position":2,"name":"product-compare"}]},{"@type":"WebSite","@id":"https:\/\/www.inhand.com\/zh\/#website","url":"https:\/\/www.inhand.com\/zh\/","name":"\u624b\u4e2d","description":"","publisher":{"@id":"https:\/\/www.inhand.com\/zh\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.inhand.com\/zh\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"zh-Hans"},{"@type":"Organization","@id":"https:\/\/www.inhand.com\/zh\/#organization","name":"\u624b\u4e2d","url":"https:\/\/www.inhand.com\/zh\/","logo":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.inhand.com\/zh\/#\/schema\/logo\/image\/","url":"https:\/\/www.inhand.com\/wp-content\/uploads\/2025\/10\/LOGO.png","contentUrl":"https:\/\/www.inhand.com\/wp-content\/uploads\/2025\/10\/LOGO.png","width":684,"height":120,"caption":"inhand"},"image":{"@id":"https:\/\/www.inhand.com\/zh\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.inhand.com\/zh\/wp-json\/wp\/v2\/pages\/83","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inhand.com\/zh\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.inhand.com\/zh\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.inhand.com\/zh\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inhand.com\/zh\/wp-json\/wp\/v2\/comments?post=83"}],"version-history":[{"count":0,"href":"https:\/\/www.inhand.com\/zh\/wp-json\/wp\/v2\/pages\/83\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.inhand.com\/zh\/wp-json\/wp\/v2\/media?parent=83"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}