javascript - ajax请求成功后如何恢复按钮的初始值

Question

在我的请求 AJAX 中，在发送前我禁用所有按钮，因为在我看来这是更好的安全选择。成功后我再次启用所有按钮。但我的页面中有许多其他按钮，并且我需要在成功请求后重新启动默认禁用状态。

是否有一种方法可以在发送之前获取设置的值并在成功后设置正确的禁用状态？

因为在我的代码中我成功启用了所有按钮，但我需要完全按照之前的请求恢复禁用状态。

在我的简单代码下面。

            $.ajax({
            url     :"/action/controller.php",                      
            type    :"POST",
            data    : data.serialize()
                    + '&'
                    + encodeURI('action')
                    + '='
                    + encodeURI(action)
                    + '&'
                    + encodeURI('tableid')
                    + '='
                    + encodeURI(tableid)
                    + '&'
                    + encodeURI('id')
                    + '='
                    + encodeURI(id),
            beforeSend: function(){
                //imgload.fadeIn('slow');
                $('button').attr('disabled', true);
                //console.log ($('button[name="action"]'));
                },
            success: function(retorno){
                //console.log( retorno );
                //msg(retorno, 'info');
                datagrid();
                $('form').unbind('submit').bind('submit');
                $('button').attr('disabled', false);
            }

html:

    <button id="formbutton" type="button"  data-action="back" data-tableid="<?php echo $tableid; ?>" data-id="<?php echo $id; ?>" class="btn btn-primary" title="Voltar" value="back">
    <span class="glyphicon glyphicon-chevron-left"></span>
</button>
<button id="formbutton" type="button" data-action="new" data-tableid="<?php echo $tableid; ?>" data-id="<?php echo $id; ?>" class="btn btn-primary" title="Novo" value="new">
    <span class="glyphicon glyphicon-plus-sign"></span>&nbsp;&nbsp;Novo
</button>
<button id="formbutton" type="submit" data-action="save" data-tableid="<?php echo $tableid; ?>" data-id="<?php echo $id; ?>" class="btn btn-primary" title="Salvar" value="save">
    <span class="glyphicon glyphicon-saved"></span>&nbsp;&nbsp;Salvar
</button>
<button id="formbutton" type="submit" data-action="delete" data-tableid="<?php echo $tableid; ?>" data-id="<?php echo $id; ?>" class="btn btn-primary" title="Delete" value="delete">
    <span class="glyphicon glyphicon-minus-sign"></span>&nbsp;&nbsp;Excluir
</button>
<button id="formbutton" type="submit" data-action="edit" data-tableid="<?php echo $tableid; ?>" data-id="<?php echo $id; ?>" class="btn btn-primary" title="Editar" value="edit">
    <span class="glyphicon glyphicon-edit"></span>&nbsp;&nbsp;Editar
</button>
<button id="formbutton" type="submit" data-action="duplicate" data-tableid="<?php echo $tableid; ?>" data-id="<?php echo $id; ?>" class="btn btn-primary" title="Duplicar" value="duplicate">
    <span class="glyphicon glyphicon-duplicate"></span>&nbsp;&nbsp;Duplicar
</button>
<button id="formbutton" type="submit" data-action="next" data-tableid="<?php echo $tableid; ?>" data-id="<?php echo $id; ?>" class="btn btn-primary" title="Proximo" value="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
</button>

Answer 1

您可以在刚刚禁用的按钮上添加一个类，并仅禁用已启用的按钮，然后您只需使用您的类启用按钮即可:

beforeSend: function(){
  //imgload.fadeIn('slow');
  $('button:enabled').addClass('toEnable').attr('disabled', true);
  //console.log ($('button[name="action"]'));
},
success: function(retorno){
  //console.log( retorno );
  //msg(retorno, 'info');
  datagrid();
  $('form').unbind('submit').bind('submit');
  $('button.toEnable').removeClass('toEnable').attr('disabled', false);
}