Question

点击后，我在网站上创建了一个按钮，我使用php发送了一些ajax文件的数据并返回结果。我正在使用的代码如下，

我的目标：

首次点击该按钮时。我想使用php在某个ajax文件上发送数据并返回结果，
第二次点击时，我只想隐藏内容，
第三次点击时，我只想显示容器而不再调用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

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 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

这样的事情应该可以解决问题...

$("#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 4

一种方法是每次用户点击按钮（http://api.jquery.com/addClass/）时使用jQuery添加一个类调用计数，你可以在处理程序中获取计数值并根据你可以处理的适当的点击。

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.
});

打电话给ajax一次

5 个答案: