Javascript 从被调用/子函数退出/中断主函数

我试图创建一些类似于在引导中加载按钮的东西。基本上是在按钮/链接内创建加载文本，并防止按钮/链接在操作结束前工作

这是我的原型

function btnLoader(b){
    var txt = b.attr('data-text' , b.text());
    b.addClass('disabled').text('......');
}

function btnunLoader(b){
    b.removeClass('disabled').text( b.attr('data-text'));
}

所以这很好，就像

<a href="#" onclick="mainFunction(1);" id="btn-1"> send comment </a>
<script>
function mainFunction( id){
    btnLoader($('#btn-'+id));
    do stuff 
    btnunLoader($('#btn-'+id));
}
</script>

但是它对调用

btnLoader

函数的

main函数没有影响，或者在第二个示例中，我想从
btnLoader

有什么办法吗

请注意，单击的元素可能是
或任何其他标记，并且它们没有禁用的属性，因此这不是选项

使用=>
if（b.prop（'disabled'，true））

获取匹配元素集中第一个元素的属性值，或为每个匹配元素设置一个或多个属性。
维护一个变量，该变量将设置一个标志，说明按钮当前是否正在加载。然后移除按钮卸载功能上的标志。因此，在这段时间内，如果有其他调用
btnLoader（）
函数，它将不会处理它，直到标志设置回false。下面是一段代码，可以让您更好地理解

var btnBusy = false;

function btnLoader(b){
  if(!btnBusy ){ // if button is not busy, ie if its not in a loading state, then put to loading state.
    var txt = b.attr('data-text' , b.text());
    b.addClass('disabled').text('......');
  }
 // else since the button is busy just don't do anything on consecutive calls to this function
}

function btnunLoader(b){
  if(btnBusy ){
     b.removeClass('disabled').text( b.attr('data-text'));
     btnBusy = false;  // set back the busy status to false
   }
}

编辑：如果中断调用子函数的主函数是您唯一的目标。然后你可以做下面的事情

function mainFunction( id){
   var loaderStatus = btnLoader($('#btn-'+id));
   if ( loaderStatus === 'break') {
      return;  // this will break your main function
   }
    do stuff 
    btnunLoader($('#btn-'+id));
}

您可以在
btnLoader
函数中设置逻辑，以便在任何时候中断主函数并将
break
字符串返回主函数

function btnLoader(b){
    // to break the function which called this function
    return 'break';
    .....
    .....
}

为什么不像下面这样简单化？如果btnLoader不应该继续，只需让它返回false，如果应该继续，则返回true

function mainFunction( id){
    if(btnLoader($('#btn-'+id)) === false) {
        return;
    }
    //do stuff 
    btnunLoader($('#btn-'+id));
}

function btnLoader(b){

    if(b.hasClass('disabled'))
        return false;

    var txt = b.attr('data-text' , b.text());
    b.addClass('disabled').text('......');
    return true;
}

编辑

如果您不想出于未知原因修改主函数，那么您总是可以抛出一个错误（尽管这可能会被很多人看不起）

看起来像是回电话给我。我想一个
jQuery
函数就可以了


$.fn.btnLoader=函数（回调）{
this.on（'click'，function（）{
btnLoader.call（这个，回调）；
});
};
函数btnLoader（回调）{
如果（$（this）.is（'.disabled'））
返回；
log（“做btnLoader的事情”）；
var txt=$（this.attr（'data-text'，$（this.text（））；
$（this）.addClass（'disabled'）.text（'……'）；
callback.call（$（this））；
}
函数mainformation（）{
日志（“做事情”）；
//做事
btunloader（这个）；
}
$（'#like btn'）.btnLoader（function（）{
日志（“做其他事情”）；
//做事
});
函数btnunLoader（）{
$（this.removeClass（'disabled'）.text（$（this.attr（'data-text'））；
}



thanx我知道如何禁用按钮，但单击的元素可能是
或任何其他标记，因此那里没有禁用的属性……为什么要中断主功能？？代码中的一切看起来都很好。什么事情没有按照你的意愿发生？@Reddy让我们说这是一个发送评论的按钮，在主功能中，我想发送一个ajax请求并将评论保存在数据库中。。。现在，用户可以通过反复单击按钮多次保存注释，但如果我在第一次单击后中断了主功能，则不会在第一次单击按钮时发生单击事件，然后当该过程完成时，可以将单击事件绑定回。如果你能提供所使用的HTML以及点击事件的绑定方式，我可以帮助你找到一个解决方案。@Reddy我想要一个覆盖所有场景的全局解决方案，我已经用HTML代码和不同的scenariothanx更新了我的答案，但它对主要功能没有影响，它还会断开页面中的所有按钮/链接。。我想禁用已单击的按钮，而不是所有按钮一起
，同时它将断开页面中的所有按钮/链接。。我想禁用已经点击的按钮，而不是所有按钮一起
你甚至不会首先提到你的页面中有多个按钮。如果破坏主函数是你的唯一目标，那么看看我编辑过的答案。我知道我可能听起来很挑剔，但对于一些我将在代码中使用数百次的东西，我需要它尽可能简单。。。因此，即使是一个简单的
if（！）->return false
也是太多的代码。。。我的计划就是这样b@max我改变了答案。它可以做你想做的，但我不建议这样做。
function btnLoader(b){
    // to break the function which called this function
    return 'break';
    .....
    .....
}

function mainFunction( id){
    if(btnLoader($('#btn-'+id)) === false) {
        return;
    }
    //do stuff 
    btnunLoader($('#btn-'+id));
}

function btnLoader(b){

    if(b.hasClass('disabled'))
        return false;

    var txt = b.attr('data-text' , b.text());
    b.addClass('disabled').text('......');
    return true;
}

function btnLoader(b){
    if(b.hasClass('disabled'))
        throw "disabled";
    var txt = b.attr('data-text' , b.text());
    b.addClass('disabled').text('......');
}