Question

我使用spin.js和jquery.spin插件来显示我的Web应用程序中ajax提交的项目的旋转图标。

它适用于常规链接按钮。然而，对于提交按钮，它没有显示，我无法弄清楚原因。

以下是代码：

形式：

=form_for(@resource, :url => add_comment_resource_path, :remote => true) do |f|
                =text_area_tag :comment,nil, :class => "span7", :rows => 3
                =f.submit "Add Comment", :class => "btn authorize spin"

JS：

//= require spin.min
//= require jquery.spin




    $('.spin').live('click',function(){
        $(this).spin('small');
    });

当我点击提交按钮时，应显示旋转图标。我可以在页面上看到以下内容插入到html中：

<input class="btn btn-small authorize spin" name="commit" type="submit" value="Add Comment">
    <div class="spinner" style="position: relative; z-index: 2000000000; left: 537px; top: 950px; " aria-role="progressbar"></input>

似乎微调器图标嵌套在输入内部，这就是它不显示的原因。我怎么才能让它显示呢？

Answer 1

有一个错字，改变这个：

$('.spin').live('click',function(){

为：

$('.spinner').on('click',function(e){ // you can use `on()` instead of `live()` which is deprecated
   e.preventDefault()

jquery旋转不替换表单的提交按钮

1 个答案: