Как предотвратить множественные вызовы ajax при нажатии кнопки воспроизведения в аудиоэлементе, используя jquery? - PullRequest
0 голосов
/ 03 мая 2020

Я пытаюсь отправить ajax запрос на обновление значения в базе данных, после вызова кнопки воспроизведения он отправляет данные на страницу процесса для обновления базы данных. Но проблема в том, что при нажатии кнопки воспроизведения AJAX запускается несколько раз. Я пытался ограничить его с помощью флага, но не сработало.

var requestSent = false;
var current_audio = document.getElementById("current_audio");
current_audio.addEventListener("play", function() {
   var data;
   var d = $('#update_counter').text();
   if (d == null)
      data = d;
   else
      data = 0;
   var date = $('#current_dat').text();
   if (!requestSent) {
      requestSent = true;
      $.ajax({
         url: "process.php",
         type: "POST",
         data: {
            data: data,
            date: date
         },
         async: false,
         cache: false,
         success: function(dataResult) {
            var dataResult = JSON.parse(dataResult);
            if (dataResult.statusCode == 200) {
               $("#update_counter").val(dataResult);
            } else if (dataResult.statusCode == 201) {
               alert("Error occured !");
            }
         },
         complete: function() {
            requestSent = false;
         },
      });
   }
});

По запросу из комментариев я также добавляю HTML, который отображается

<tr class="hidden" style="background-color:'.$result3["planet_color"].';border:1px solid black;padding:10px;color:white;">
<td start="'.strtotime($time_prev).'" finish="'.strtotime($time_next).'" style="padding:20px;">
                    <div class="row">
                        <div class="col-md-4 col-sm-12">
                                <p>
                                    <audio class="play_audio" controls loop>
                                       <source src="'.$result3["planet_mantra"].'" type="audio/mpeg">
                                       Your browser does not support the audio tag.
                                    </audio>
                                </p>
                                <p>Times Played :   
                                    <span id="current_dat" style="display:none;">'.$current_date.'</span> 
                                    <span id="update_counter"></span>
                                </p>
                                <p style="font-size:10px;">Location : <strong>'.$place.'</strong></p>

                        </div>
                    </div>

                    </td>

            </tr>

Теперь, так как из 24 элементов виден только один элемент, я хочу получить доступ к кнопке воспроизведения только

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...