Question

我在2个不同的ajax文件ajaxChangeSimple.php和ajaxChangAdv.php中有2个表单。当用户按下按钮时，它应该在2个表单之间切换。

$(document).ready(function(){
$('.changeBtn').on('click',function(){
  var yo="<?php echo 'ip_searchmod_'.$unique_qsid; ?>";

  $.ajax({

    type:"POST",
    url:"ajaxChangeSimple.php",
    success: function(response){

      $('#' + yo).html(response);
      $('#swapper').addClass('simpleBtn');
      $('#swapper').removeClass('changeBtn');
    }

  });

});
});


$(document).ready(function(){
$('.simpleBtn').on('click',function(){
  var yo="<?php echo 'ip_searchmod_'.$unique_qsid; ?>";

  $.ajax({

    type:"POST",
    url:"ajaxChangeAdv.php",
    success: function(response){

      $('#' + yo).html(response);
      $('#swapper').addClass('changeBtn');
      $('#swapper').removeClass('simpleBtn');
    }

  });

});
});

<div id="swapper" class="changeBtn">Change</div>

当我第一次点击按钮时，froms交换，#swapper的类也是如此。但是在我再次单击它之后，即使#swapper的类现在是.simpleBtn，第一个ajax函数也会被调用。（我通过网络查看）。

可能是什么问题？

Answer 1

您可以简化逻辑委派事件和切换类，例如：

$(document).on('click', '.changeBtn, .simpleBtn', function(){
  var yo="<?php echo 'ip_searchmod_'.$unique_qsid; ?>";
  $.ajax({
    type:"POST",
    url:$(this).hasClass('changeBtn') ? "ajaxChangeSimple.php" : "ajaxChangeAdv.php",
    success: function(response){
      $('#' + yo).html(response);
      $('#swapper').toggleClass('simpleBtn changeBtn');
    }
  });
});

在某些情况下它无法按预期工作，但我想在你的具体情况下，它会。

即使删除了Selector类，ajax也会继续运行

1 个答案: