4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

「ブログで色々公開したら、恥をかいたけどすごく勉強になった。」の添削

Posted at

http://programming-10000.hatenadiary.jp/entry/20140105/1388920615
の添削です。
JS のみ記載、未実行なので、何かしらバグがあるかも?

$(function() {
    var timerId = 0;
    // jQuery オブジェクト生成はコストが高いので極力減らす。繰り返し使うときは変数に保持。
    // $ で始まる変数名は jQuery オブジェクトっていう命名ルールは単に好みの問題。
    var $input = $('#input');    
    var $result = $('#result');
    // 今どきの jQuery なら on を使いたい。
    var $stopBtn = $('#stopBtn').on('click', function() {
        clearTimeout(timerId);
        // 連打対策の解除。
        $startBtn.prop('disabled', false);
    });
    var $startBtn = $('#startBtn').on('click', function() {
        // 1000 ミリ秒待ち中に連打された時の対策
        // $stopBtn.trigger('click');
        // こっちの連打対策の方がカッコイイかも。prop と attr の違いに注意。
        $startBtn.prop('disabled', true);
        $.post('/ajax', {
            'input': $input.val()
        }, function(res) {
            $result.append(
                'SESSION ID:' + res.session + ' ||| ' +
                'MY NAME:' + res.name + '<br />'
            );
            timerId = setTimeout(function(){
                // 1000 ミリ秒後にまたスタートボタンをクリックする。
                $startBtn.trigger('click');
            }, 1000);
        });
    // 初回に trigger する事で、ページロード完了時に1回スタートボタンをクリックしたのと同等。
    }).trigger('click');
});
4
4
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?