Question

我正在尝试在相同（rails）形式的两个字段上加载两个微调器，这两个字段都有一个键盘远程调用。

使用Jquery，我有以下代码：

<div class="form_element">
  <%= f.label :email, :class=>"field_hint", :title=>"Email" %>
  <%= f.text_field :email %>
  <div class="myloader" style="display:none;">
    <p>
    validating...
    </p>
  </div>
</div>

<div class="form_element">
  <%= f.label :username, :class=>"field_hint", :title=>"Username" %>
  <%= f.text_field :username %>
    <div class="myloader" style="display:none;">
      <p>
      validating...
      </p>
    </div>
</div>

这两个字段都有一个远程调用的密钥：

$('.form_element').ajaxStart(function() {
  $(this).children('.myloader').show();
});

$('.form_element').ajaxStop(function() {
  $(this).children('.myloader').delay(1000).fadeOut('fast');
});

当ajax发生的时刻，当我只想要作为该字段的兄弟的微调器时，两个微调器都会出现，我试图找出如何使每个微调器div与其字段相关。

我是Ajax的新手，所以任何关于可能以不同方式执行ajaxStart / Stop的建议都非常受欢迎，也许只是让一个微调器移动到字段旁边而不是两个微调器会有所帮助。

Answer 1

我鼓励您将此jQuery插件用于您的任务：http://plugins.jquery.com/project/nimbleLoader

它允许您为网页中的任何元素创建加载栏。您可以在此处看到示例：http://www.salesclic.com/jquery.nimble.loader/demo/

相对于多个表单字段的Jquery ajax微调器

1 个答案: