1

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

谢谢

4

2 回答 2

1

当您使用该:disable_with选项时，您使用的是 Rails Unobtrosive Javascript 驱动程序 jquery-ujs，它从 Rails 3.1 开始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 规则来防止盒子重新调整大小或做任何你不喜欢的事情。无论哪种方式，这都会解决您的问题。

于 2013-01-31T21:00:53.857 回答
0

保存按钮时保持相同宽度的 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', '')

感谢小矮人。

于 2014-10-17T14:04:05.053 回答