起因：手機端沒有hover特效，當你點選的時候就直接觸發click.

如圖：

強行使用hover在ipad 或者mobile留下hover, 直到下次點選才能取消。

解決：手機端有他特殊touch事件。touchstart，touchmove, touchend.（PS：電腦端沒有的，PC使用mouseover和mouseout）

話不多說，上程式碼：

1.html頁面

<div class="pr-account-tab">
  <div class="pr-account-tab_account-info_value">
    <span class="pr-account-tab__account-value">Value:</span>
  </div>
</div>
 

2.js(使用JQuery on)

          //To solve PR-198
          $(".pr-account-tab").on("touchstart", touchStart);
          // $(".pr-account-tab").on("touchmove", touchMove);
          $(".pr-account-tab").on("touchend", touchEnd);
          $(".pr-account-tab").on("mouseover", touchStart);
          $(".pr-account-tab").on("mouseout", touchEnd);

          function touchStart(event) {
            $(this).addClass("pr-account-tab-mobile");
          }

          // function touchMove(event) {
          //   // $("pr-account-tab-mobile").html("You are moving");
          //   // $(this).addClass("pr-account-tab-mobile");
          // }

          function touchEnd(event) {
            $(this).removeClass("pr-account-tab-mobile");
          }
 

另：js(不使用JQuery)

可以用事件監聽取代：

          document.getElementById("pr-account-tab-id").addEventListener("touchstart", touchStart, false);
          document.getElementById("pr-account-tab-id").addEventListener("touchmove", touchMove, false);
          document.getElementById("pr-account-tab-id").addEventListener("touchend", touchEnd, false);
 

3.css

.pr-account-tab-mobile {
	background-color: green;	
}

注：

我使用的是background-color,不是

 &:hover {
   background-color: @pr-account-tab--hover__bg-color;
  } 

使用hover的形式。