span 元素上的单击事件适用于桌面，但不适用于移动设备 (jquery)

Question

span 元素上的单击事件在桌面上触发，但在移动设备上不会触发。跨度是当前温度旁边的温度单位，一旦用户单击"获取天气"按钮，就会填充该温度。

这是与跨度单击事件相关的代码部分：

$(document).on('click', "span" , function(){
    var str=document.getElementById("tempUnits").innerHTML;
    if (str==="Celsius"){
      document.getElementById("tempUnits").innerHTML="Fahrenheit";
      $("#temp").html(tempC + '<span id="tempUnitsSpan"><strong> C </strong></span>' + " and " + weatherDescription);
    }
    else if (str==="Fahrenheit"){
      document.getElementById("tempUnits").innerHTML="Celsius";
          tempF=Math.max( Math.round((tempC*1.8+32) * 10) / 10, 2.8 ).toFixed(2);
        console.log(tempF);
      $("#temp").html(tempF + '<span id="tempUnitsSpan"><strong> F  </strong></span>' + " and " + weatherDescription);
    }

页

带代码的页面

Answer 1

我猜如果在移动设备上点击该元素两次，它会起作用。若要解决此问题，请添加 touchstart 事件。当触摸点放置在触摸表面上时，将触发触摸启动事件。

$(document).on('click touchstart', "span" , function(){
}