分类导航

jQuery 发布时间：2022-03-30 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了启用/禁用多个引导按钮的最佳方法(Jquery)，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

我想启用和禁用引导按钮.页面上有4个按钮,在加载时,第一个按钮被启用,其余被禁用.现在当我点击button1时,应启用该按钮的其余部分并禁用button1.

下面是我的代码它可以禁用第一个按钮但是休息按钮没有启用.

$('document').ready(function() {
    $("#add_resume1").on("submit",function(E) {                
        e.preventDefault;
        var btn = $('#btn-save1');
        // btn.button('loading');
        $.ajax({
            type: 'post',url:$('form#add_resume1').attr('action'),cache: false,dataType: 'json',data: $('form#add_resume1').serialize(),beforeSend: function() { 
                $("#validation-errors").hide().empty(); 
            },success: function(data) {
                if(data.success == falsE) {
                    var arr = data.errors;
                    $.each(arr,function(index,value) {
                        if (value.length != 0) {
                            $("#validation-errors").append('<div class="alert alert-danger"><strong>'+ value +'</strong><div>');
                            $('#basicdetails').val('');
                            $('#button.disabled[disabled=disabled]')
                                .removeClass('disabled')
                                .prop('disabled',falsE);
                                //.text('Click Me');
                        }
                    });
                    $("#validation-errors").show(); 
                    btn.button('reset');                            
                } else {
                    $("#success").html('<div class="alert alert-success">Basic details saved successfully.<div>');
                    $('#basicdetails').val('');
                    $('#btn-save1').prop('disabled',truE);
                    $('#button.disabled[disabled=disabled]')
                        .removeClass('disabled')
                        .prop('disabled',falsE);
                }
            },error: function(xhr,textStatus,thrownerror) {
                //alert('Something went to wrong.Please Try again later...');
                alert(thrownerror);
                btn.button('reset');
            }
        });             
        return false;
    });
});

感谢您的意见

编辑

<button type="submit" class="btn btn-home" name= "btn-save5" id= "btn-save5" disabled="disabled" required="required">Save</button>

这是html文件中的按钮代码. html文件很大.所以,我只是给你按钮代码. btn-save5,btn-save4,btn-save3m与此类似.

解决方法

您询问了启用/禁用按钮的最佳方法.所以我要求Gianca的小提琴.

修改：

为这些禁用按钮指定专用类.像下面示例中的保存按钮一样.否则$(‘button’)将影响整个DOm.

<button type="submit" class="btn btn-home save-button" name= "btn-save5" id= "btn-save5" disabled required="required">Save</button>

<button type="submit" class="btn btn-home save-button" name= "btn-save5" id= "btn-save4" disabled required="required">Save</button>

<button type="submit" class="btn btn-home save-button" name= "btn-save5" id= "btn-save3" disabled required="required">Save</button>

jQuery的：

$('.btn.btn-home.save-button')
        .removeClass('disabled')
        .prop('disabled',falsE);
      $('#add_resume1').prop('disabled',truE);
    });

Fiddle