Javascript 如何防止jQuery函数中的重复？

我有一个简单的jQuery函数

$('.button').click(function(){
   $("#target").slideToggle().load('http://page');
});

通过

slideToggle

行为，每次单击都会导致幻灯片，但问题是它也会再次加载

url

如何限制每次单击时只执行一次

load（）

功能，而不执行

slideToggle（）

。换句话说，如何防止后续单击中的

load（）

（仅加载，而不是整个函数？

有一个变量（全局）说明是否已加载。例如：

var loaded = false;
$('.button').click(function(){
   if(!loaded){
      $('#target').load('http://page');
      loaded = true;
   }
   $("#target").slideToggle();
});

这将导致每次单击时发生滑动切换，但页面仅加载一次：

还有一种没有全局变量的方法：

$('.button')
    .on('click', function() {
        if ( !$(this).data("loaded") ) {
            $("#target").load('http://page');
            $(this).data("loaded", true);
        }
        $("#target").slideToggle();
    });

---

仅获取最后一个操作的简单方法是在所需方法之前使用停止方法：

$('.button').click(function(){
   $("#target").stop().slideToggle().load('http://page');
});

---

这仍然会导致每次操作都会发生负载。

$('.button').click(function(){
   $("#target").stop().slideToggle().load('http://page');
});