该功能在台式机和仿真器上有效,但不适用于移动浏览器

时间:2019-07-12 18:27:18

标签: javascript jquery wordpress mobile

我有一个WordPress Woocomerce网站。我具有更多/更少阅读功能,可以扩展/隐藏较长的产品说明。它在桌面上运行良好。甚至可以使用Chrome的移动模拟器工具运行。

但是在任何移动浏览器上都没有。按下按钮只会使页面跳上一点。我假设浏览器没有读取.on('click 'touchstart').

$(document).ready(function() {

      $(".product-readmore").on('click touchstart', function() {

          var description = document.querySelector(".product-description-readmore");

          if (description.style.height === '') {
            description.style.height = 'auto';
          } else if (description.style.height === 'auto') {
            description.style.height = '';
          } else {
            description.style.height = '92px';
          }

          $(this).text($(this).text() == 'Read less...' ? 'Read more...' : 'Read 
            less...');
          });
      });

1 个答案:

答案 0 :(得分:1)

事实证明,问题在于WordPress如何处理jQuery。我将第一行更改为div

现在,它在所有浏览器(移动版和其他版本)上都可以正常工作。