Вызов ajax один раз

Question

Я создал кнопку на моем веб-сайте, когда она нажата, я отправил данные на файл php с помощью ajax и вернул результаты. Код, я использую ниже,

Моя цель:

1. Когда эта кнопка нажата в первый раз. Я хочу, чтобы отправить данные на какой-php файл с помощью ajax и возвращать результаты, и
2. Когда она нажата во второй раз, я просто хочу, чтобы скрыть содержимое, и
3. Когда она нажата в третий раз , Я просто хочу показать контейнер без повторного вызова ajax.

JQuery:

$(function() { 
    $('#click_me').click(function(){ 
     var container = $('#container').css('display'); 
     var id = $('#id').html(); 
      if(container == 'none'){ 
       $.ajax({ 
       type: 'POST', 
       data: {id: id}, 
       url: "ajax/get_items.php", 
       }).done(function(data) { 
       $('#container').html(data); 
       }).success(function(){ 
       $('#container').show('fast'); 
       }); 
       }else if(container == 'block'){ 
     $('#container').hide('fast'); 
     } 
     }); 
}); 

Html:

<input type="button" id="click_me" value="Click Me"/> 
<div id="container"></div> 

Answer 1

Что-то вроде этого следует сделать трюк ...

$("#click_me").click(function(){ 
    var $btn = $(this); 
    var count = ($btn.data("click_count") || 0) + 1; 
    $btn.data("click_count", count); 
    if (count == 1) { 
    $.ajax({ 
     var container = $('#container').css('display'); 
     var id = $('#id').html(); 
     if(container == 'none'){ 
     $.ajax({ 
      type: 'POST', 
      data: {id: id}, 
      url: "ajax/get_items.php" 
    }) 
    } 
    else if (count == 2) { 
    $('#container').hide('fast'); 
    } 
    else { 
    $('#container').show('fast'); 
    $btn.unbind("click"); 
    } 
    return false; 
}); 

Answer 2

Вы можете использовать counter

http://forum.jquery.com/topic/making-a-number-counter

(function() { 
    var count = 0; 

    $('table').click(function() { 
    count += 1; 

    if (count == 2) { 
     // come code 
    } 
    }); 
})(); 

JQuery Mouse Click counter

Рабочий пример вашего кода: -

http://jsfiddle.net/2aQ2g/68/

Answer 3

Путь JQuery будет выглядеть так:

$(function() { 
    $('#click_me').one('click', function() { 
     $.ajax({ 
      // ... other params ..., 
      success: function(result) { 
       $('#container').html(result).show('fast'); 
       $('#click_me').click(function() { 
        $('#container').toggle('fast'); 
       }); 
      }); 
     }); 
    }); 
}); 

http://api.jquery.com/one/

http://api.jquery.com/toggle/

Answer 4

Один из способов сделать это - добавить счетчик вызовов класса, используя jQuery каждый раз, когда пользователь нажимает кнопку (http://api.jquery.com/addClass/), и вы можете получить значение count в обработчике и на основе того, что вы можете обработать щелчок соответствующим образом.

Answer 5

Вы можете сделать это, указав простую переменную, подсчитывая клики.

$(function() { 
    var clickCount = 1; //Start with first click 

    $('#click_me').click(function(){ 
     switch(clickCount) { 
      case 1: //Code for the first click 

       // I am just pasting your code, if may have to change this 
       var container = $('#container').css('display'); 
       var id = $('#id').html(); 
        if(container == 'none'){ 
         $.ajax({ 
         type: 'POST', 
         data: {id: id}, 
         url: "ajax/get_items.php", 
         }).done(function(data) { 
         $('#container').html(data); 
         }).success(function(){ 
         $('#container').show('fast'); 
         }); 
         }else if(container == 'block'){ 
       $('#container').hide('fast'); 
       } 
       break; 
       case 2: 
       //code for second click 
       break; 
       case 3: 
       //Code for the third click 
       break;  
     }); 
     clickCount++; //Add to the click. 
});