：disable_with但不调整

Question

任何熟悉：disable_with选项的人都会知道，它会在点击时调整大小以适应输入按钮的新文本。无论按钮的新内容如何，​​我都希望按钮保持其原始大小。任何人都知道如何做到这一点？

感谢

Answer 1

当您使用:disable_with选项，您使用Rails的Unobtrosive的Javascript驱动程序，因为Rails的3.1 jQuery的UJS它调用data-disable-with数据处理程序的位置：

/** 
* disable-with handlers 
*/ 
var disable_with_input_selector = 'input[data-disable-with]'; 
var disable_with_form_selector = 'form[data-remote]:has(' + disable_with_input_selector + ')'; 

$(disable_with_form_selector).live('ajax:before', function() { 
    $(this).find(disable_with_input_selector).each(function() { 
     var input = $(this); 
     input.data('enable-with', input.val()) 
      .attr('value', input.attr('data-disable-with')) 
      .attr('disabled', 'disabled'); 
    }); 
}); 

$(disable_with_form_selector).live('ajax:complete', function() { 
    $(this).find(disable_with_input_selector).each(function() { 
     var input = $(this); 
     input.removeAttr('disabled') 
      .val(input.data('enable-with')); 
    }); 
}); 

如果”我们会注意到，在这里没有什么重新调整你的按钮的大小。这个扩展很可能是由额外的文本引起的，尽管它可能是由一些附属于disabled属性的默认jQuery CSS引起的（我没有真正检查过，但这看起来不太可能）。我建议写严格的CSS规则，以防止重新调整大小或做任何你不喜欢的事情。无论哪种方式，这将解决您的问题。

Answer 2

CS的片段，以保持按钮相同的宽度上节省：

btn = 'input[data-disable-with]' 
frm = 'form[data-remote]:has(' + btn + ')' 

$(frm).on 'ajax:before', -> 
    $(@).find(btn).each -> 
     input = $(@) 
     input.css('width', input.css('width')) 

$(frm).on 'ajax:complete', -> 
    $(@).find(btn).each -> 
     $(@).css('width', '') 

感谢dward。