Javascript 使用jQuery切换元素的适当条件

当用户单击一个元素时，我想切换一个框来显示，然后用ajax加载一些内容。一切正常。但是当它再次被点击时，我希望它切换为隐藏，而不是再次加载内容

与当前一样，它将切换取消隐藏并加载ajax。再次单击时，只需重新加载ajax，元素仍然可见

---

对于此javascript新手的任何指导都将不胜感激。

您可以使用计数器/布尔值，当显示元素时，检查计数器/布尔值。如果计数器/布尔值仍然等于其原始值，则加载ajax并更改其值。或者，您可以在第一次加载ajax时向元素添加一个数据属性，然后在显示元素时始终检查该数据属性是否存在。如果存在，不要加载ajax数据

---

我重新创建了您的问题，以直观地演示如何根据您的需求制作事件。在我的示例中，div只会在第二次单击时变大，而不会在任何其他单击时变大。您可以将此应用于加载问题。。这个过程就是我喜欢称之为标记的过程。它与设置变量有关，以便您可以控制函数或语句的流

$（文档）.ready（函数（）{
var happend=false；
$（“div”）。单击（函数（事件）{
如果（$（this.css（“背景色”）！=“rgb（0，128，0）”）{
$（this.css（“背景色”、“绿色”）
console.log（$（this.css（“背景色”））
//happend=false
}否则{
$（this.css（“背景色”、“蓝色”）
如果（！happend）{
$（this）.animate（{“height”：“+=50}）
happend=true
}
}
})
});

按钮
$(document).ready(function() {

    $(".media").hide();

    $(".infobox").click(function(event) {
        var isVisible = $("."+event.currentTarget.id).is(":visible");
        if(isVisible) {
            $("."+event.currentTarget.id).slideToggle(100);
        }
        else {
            $("."+event.currentTarget.id).slideToggle(100);
            $("#media"+event.currentTarget.id).load("/mediabox/"+event.currentTarget.id);
        }
    });
});

if (!$div.data("loaded")) {
    $div.data("loaded", true);
    //load ajax data
  }

$(function () {
    var isEverLoadContent = false;
    $('.media').hide();

    // your code above
    else {
        if (!isEverLoadContent) {
            // Perform ajax request
            // if done set to true
            isEverLoadContent = true;
        }
        // Your next task
    }
    // Continue your code
});