0

こんにちは、みんな、

私がやろうとしているのは、誰かがキーアップでテキストフィールドにテキストを入力している間にアニメーションgifを表示し、入力が完了するとgifが消えて「保存されました」というメッセージを数秒間表示することです。消える。

私がこれまでに行ったことは次のとおりです。

if ($('.gallery_items li input').length > 0) {
    $('.gallery_items li input').keyup(function() {         
        var li = $(this).parent();
        li.children('.gallery_saving').removeClass('dn');
        var identity = li.attr('id').split('_');
        var v = $(this).val();
        var url = '/caption/id/' + identity[1];
        $.post(url, { caption : v });   
        $.delay(500).li.children('.gallery_saving').delay(500).html('Saved...').delay(500).addClass('dn');          
        return false;
    });
}

クラス「gallery_ Saving」には背景画像として割り当てられたアニメーション gif があり、クラス「dn」には単に css「display:none」があります。最初は「gallery_Saving」にもクラス「dn」があります-表示されないように、誰かが入力を開始するとクラス「dn」が削除され、ローダーが表示されます。

あなたは明らかに問題をすでに見ています：

$.delay(500).li.children('.gallery_saving').delay(500).html('Saved...').delay(500).addClass('dn');

私はそれが間違っていることを知っていますが、それを行う方法がわかりません - 誰か助けてもらえますか?

4

2 に答える 2

1

ユーザーが実際に入力を終えていない場合、多くのajax呼び出しを行うことになりますので、これを試してみるのは特に良い考えではありません。ユーザーが入力に時間がかかる場合は、理由もなくデータを何度も保存することになります。

クラスの代わりにshow()andを使用することもできます。または、toggleClass（）を使用しますhide()dn

于 2011-04-19T09:42:12.197 に答える
1

遅延時間ではなく、入力されたデータが無事に安全になったときにローダーを削除する必要があります。

何かのようなもの

url = "/echo/html";
v = "test";
$.ajax({
  url: url,
  type: 'POST',
  data: ({ caption: v}),
  success: function(){
    $('.gallery_saving').html('Saved...').delay(1000).fadeToggle("slow");
  },
  error:  function() {
    $('.gallery_saving').html('Error...').delay(1000).fadeToggle("slow");
  }
});

例: http://fiddle.jshell.net/gabel/udvbx/

詳細についてはhttp://api.jquery.com/jQuery.ajax/を参照してください...

于 2011-04-19T09:41:20.007 に答える