'data-disable-with' 触发表单上的所有按钮

Question

我在多步骤表单中有两个按钮：继续和返回。

<%= f.button_tag "#{t :Back}", name: 'back_button', id: 'back_button', class: "btn btn-primary", style:"background: #d3f0fe !important; color: #44B5EB !important;", 'data-disable-with' =>"<i class='fa fa-spinner fa-spin'></i> #{t :processing}".html_safe unless @event.first_step? %>

<%= f.button_tag "#{t :Continue}", id: 'submit-all', class: "btn btn-primary", 'data-disable-with' =>"<i class='fa fa-spinner fa-spin'></i> #{t :processing}".html_safe %>

我添加了以下 JS 以在用户单击另一个按钮时禁用一个按钮：

$('#back_button').click( function () {
    var buttons = $('#back_button').not($(this));
    buttons.removeAttr('data-disable-with');
    buttons.attr('disabled', true);
});



$('#submit-all').click( function () {
    var buttons = $('#submit-all').not($(this));
    buttons.removeAttr('data-disable-with');
    buttons.attr('disabled', true);
});

但由于某种原因，它不起作用，当单击任一按钮时，两个按钮都会变成“正在处理”。

请问有人发现代码有问题吗？

Answer 1

我最终做了：

$('#back_button').click( function () {
    var buttons = $('#submit-all');
    buttons.removeAttr('data-disable-with');
    buttons.attr('disabled', true);
});



$('#submit-all').click( function () {
    var buttons = $('#back_button');
    buttons.removeAttr('data-disable-with');
    buttons.attr('disabled', true);
});