Почему мои jjery ajax-запросы выполняются несколько раз?

Я смотрю на консоль в firebug, когда нажимаю на функцию, которая выполняет запрос ajax. Проблема в том, что одним нажатием кнопки отправляется 1 ajax-запрос, но я получаю 2 отправленных запроса!

Код для моего js выглядит следующим образом:

$(document).ready(function() {
   $('.book_now').click(function(){


$.ajax({
  type: 'POST',
  url: '/booking.php',
  data: 'event_id='+event_id+'&time_id='+time_id,
  success: function(data) {
    console.log('inside');
    $('#booking_box_content').html(data);
  }
});


  });
});

Что кажется довольно прямым, верно?

В моей консоли, однако, я вижу 2 x GET-запроса с одного клика.

Моя кнопка просто:

<div class="book_now"></div>

Я что-то упустил - должно быть 2 ПОЛУЧИТЬ запросы?

Случайно ли снова загружается функция $ (document) .ready (), когда загружается новый файл, и, следовательно, снова выполняется функция щелчка?

Примечание. Я не дважды нажимаю на кнопку. Это, вероятно, не имеет значения, но если я изменю его на POST, он тоже сделает это дважды.

Редактировать: ответ от booking.php

<div id="booking_box_left">
  <h1 class="speaker_name"></h1>
  <h1 class="event_name"></h1>

  <div class="event_start_header">Start</div><div id="event_start_datetime">, </div>
  <div class="cleared"></div>
  <div class="event_end_header">End</div><div id="event_end_datetime">, </div>
  <div class="cleared"></div>
  <div class="event_where_header">Where</div><div id="event_where"><strong></strong><br /><br />
</div>

</div>
<div id="booking_box_right_container">
  <form id="booking_form_1" method="post">
    <input type="hidden" name="booking_id" value="7a614fd06c325499f1680b9896beedeb" />
    <input type="hidden" name="event_id" value="" />
    <input type="hidden" name="time_id" value="" />
    <div id="booking_box_right">
      <h1>To reserve your seat</h1>
      <input type="text" name="booking_email" class="enterSomething booking_email" title="Enter your email..." />
      <div class="booking_email_helper">On clicking next a ticket will be held for you for a short period for you to complete your registration.</div>
      <input type="submit" id="next" value="Next" />
    </div>
  </form>
</div>

Примечание: ничто в этом ответе не имеет функций, запускаемых, насколько мне известно. Я скептически отношусь к тому, что ответом является то, что дважды запускает ajax-запрос ... если функция щелчка запускается только один раз, то не может быть, чтобы кнопка выполняла функцию дважды, но $ .ajax () часть, а именно обратный вызов успеха, который есть. Я обновил код JS, чтобы показать, как я структурировал материал console.log ().

ФИНАЛЬНОЕ РЕДАКТИРОВАНИЕ:

Моя функция ajax была заключена в следующее:

   $('#shade, #booking_box').fadeIn(function(){

     // ajax function

  }

Я понятия не имел, но он вызывал эта функция для когда #shade (мой Thickbox) и #booking_box вошли, следовательно, запустить его ДВАЖДЫ! : (

Я чувствую себя таким инструментом.

Спасибо всем за помощь.

11
задан Angkor Wat 27 August 2010 в 05:54
поделиться

1 ответ

Возможно несколько вещей:

  1. Обработчик кликов был привязан дважды. Измените $('.book_now').click(function(){ на $('.book_now').unbind('click').click(function(){ на Позже вы можете реорганизовать свой код, чтобы использовать $('.book_now').unbind('click',handler).click(handler);.

  2. На на стороне сервера, что приводит к появлению двух выполненных ajax-запросов. Это означает, что console.log('inside') будет запущен только один раз.

  3. Обработчик кликов срабатывает дважды. отладьте это, добавьте точку останова в обработчик кликов с помощью инструментов разработчика firebug или webkit и отладьте его вручную. Вы сможете просмотреть «стек вызовов» и выяснить, так ли это.

8
ответ дан 3 December 2019 в 08:28
поделиться
Другие вопросы по тегам:

Похожие вопросы: