ajaxの非同期動作がiosだと動かない

railsでajaxを用いてストップウォッチのアプリを作成中なのですが,macのchromeとsafariでは動くのですが、iphoneで試してみたところ動きません。色々と調べたのですがわからなかったので教えてください。。

試してみたこと

iosだとクリックイベントができていないので、調べるとcssにcursor: pointerの記載をしてみましたが、変わりませんでした。

<body>
<div class="d-flex justify-content-center">
  <button class="btn btn-danger " id="start_btn">START</button>
  <button class="btn btn-danger " id="stop_btn">STOP</button>
</div>
<input class="form-control" id="counter" name="counter" type="text" value="00:00:00:00">
</body>
<script>
$(function(){
      reset_timer();
    
      var timer;
      var timerID;
      var timerFlag = 0;	// 0:停止 1:動作
    
      
      $("#start_btn").on("click", function(){
        start_count();
      });

      $("#stop_btn").on("click", function(){
        stop_count();
      });
   
      function reset_timer() {
        if(timerFlag === 1){
          stop_count();
        }
        timer = 0; 
        $("#counter").val("00:00:00:00");
      }
    
  
      function start_count() { 					
        $("#start_btn").val("stop");
        timerFlag = 1;
        timerID = setInterval(count_up, 10); 
      }
    

      function stop_count() { 					
        $("#stop_btn").val("start");
        timerFlag = 0;
        clearInterval(timerID);
      }
    
  
      function count_up() {
        ++timer;
        var formatTimer = counter_format(timer);
        $("#counter").val(formatTimer);
      }
    
      function counter_format(num) {
        var numZan = num;	// 残りの時間(10ミリ秒単位)
        var hh = Math.floor(numZan / (100 * 60 * 60));
        numZan = numZan - (hh * 100 * 60 * 60);
        var mm = Math.floor(numZan / (100 * 60));
        numZan = numZan -(mm * 100 * 60);
        var ss = Math.floor(numZan / 100);
        numZan = numZan - (ss * 100);
        var ms = numZan;
        
        if(hh < 10){hh = "0" + hh;}
        if(mm < 10){mm = "0" + mm;}
        if(ss < 10){ss = "0" + ss;}
        if(ms < 10){ms = "0" + ms;}
        return hh + ":" + mm + ":" + ss + ":" + ms;
      }
    });
  
  </script>