-2

我正在尝试将按钮的值从“提交”更改为“正在加载...”,并在处理某些代码时禁用该按钮。该过程完成后,该按钮应重置。我觉得这可以比单独使用 .attr 和 .prop 做得更好。任何人都可以帮助将我的代码改进为最有效的形式吗?

HTML

<button class="btn btn-primary" id="button">Submit</button>

感谢大家对 .attr 和不同写作风格的解释,我开始觉得这可能是我发现写这篇文章的最有效方式,因为它减少了对“#button”的访问次数如此之多。

$('#button').click(function() {
    $(this).text('Loading...').prop('disabled', true);

    //process

    $(this).text('Submit').prop('disabled', false);
});

$('#button').click(function() {
    $(this).prop('disabled', true);
    $(this).attr('value', 'Loading...');

    //process

    $(this).attr('value', 'Submit');
    $(this).prop("disabled", false)
});

如果您不同意或有更好的写作风格,请发表评论。

4

4 回答 4

1

使用.text().html()

$(this).text('Loading...');
$(this).html('Loading...');
于 2013-04-26T09:22:39.537 回答
1

它不是<input>with type 按钮 - 它是一个按钮,在 HTML5 按钮中,值位于标签本身内部,例如<button>Value</button>. 因此,尝试使用 jQuery 操作它的值attr是行不通的,因为值是文本本身。

您需要使用的是 jQuery 的text()方法。

这是一个工作的jsFiddle。

和代码本身:

$(this).text('Loading...').prop('disabled', true);
于 2013-04-26T09:24:34.853 回答
0

尝试这个

$('#button').click(function() {
    $(this).prop('disabled', true);
    $(this).text('Loading...');

    //process

    $(this).text('Submit');
    $(this).prop("disabled", false)
});

阅读http://api.jquery.com/text

于 2013-04-26T09:25:36.357 回答
0

您可以将两者结合起来

$(this).html("Loading...").prop("disabled", true);
于 2013-04-26T09:31:28.463 回答