Bootstrap-谁能给我任何例子，如何设置JS按钮? [英] Bootstrap - could anyone give me any example, how to set up JS buttons?

问题描述

我正在使用Bootstrap的状态按钮-特别是在加载中状态，但仍然找不到正确的设置来使其正常运行.我有一个基于AJAX的简单表单，类似这样:

I am playing with Bootstrap's stateful buttons - specifically with Loading state, but still can't find the right set up to get it working. I have a simple form based on AJAX, something like that:

<%=form_tag '/comments', :remote => true do %>
  <div><%=text_area_tag 'comment[text_comment]'%></div>
  <div><button class="btn btn-primary" data-loading-text="loading stuff..." >Post</button></div>
<%end%>

但是当我单击 POST 按钮时，仍在发送表单，但是未显示按钮效果(正在加载内容... )，就像引导页面上的示例.

But still when I click on the POST button, so the form is sending, but the button effect (loading stuff...) is not displayed, like the example on Bootstrap's page.

有人可以给我提示如何修复它吗?

Could anyone gives me a tip on how to fix it?

推荐答案

您需要明确设置按钮处于加载状态.像这样:

You need to explicitly set that the button is in the loading state. Something like this:

// Set up the buttons
$(button).button();    
$(button).click(function() {
    $(this).button('loading');
    // Then whatever you actually want to do i.e. submit form
    // After that has finished, reset the button state using
    // $(this).button('reset');
}

我已经创建了一个有效的 JSFiddle示例.

I've created a working JSFiddle example.

这篇关于Bootstrap-谁能给我任何例子，如何设置JS按钮?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！