忍者ブログ

STEP UP BLOG

Home > ブログ > javascript

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

Firefoxのevent

最近デフォルトのブラウザをChromeからFirefoxに変えました。
なんだかChromeがやけに重くなるときがあって、試しにFirefoxに変えてみたら(こちらも以前は重かった印象がある)、
なんということでしょう、爆速ではないですか。
爆速というと言い過ぎですが、とにかくストレスが無い表示速度。
ということで最近はFirefoxでネットサーフィン(90年代)しているのですが、たまにFirefoxでしか味わえないエラーに出会うこともあります。
エラー出合い系ブラウザといえばIEですが、近年はIEも賢くなってきて相対的にFirefoxの仲間外れ度が増してきたようですが。。
そんなFirefoxでの、そこは空気読んでくれないかなという仕様のひとつがeventです。
$("#some_button").click(function() {
    event.preventDefault();
    console.log("clicked");
});

Firefoxで実行すると"event is not defined"となります。
$("#some_button").click(function(evt) {
    evt.preventDefault();
    console.log("clicked");
});

こちらならFirefoxでも正常に動くのですが。
ただ、
$("#some_button").click(function(evt) {
    var e = evt.originalEvent;
    e.preventDefault();
    console.log("clicked");
});

こちらとの違いがよくわかってません。。。
Googleで調べると、結構以前からFirefoxはこの仕様の模様(根本的なところはGeckoだからなのか?)
ということでjavascriptでeventを取り扱うときは注意ですね><
PR

シンプルなAjaxライブラリとしてのSuperAgent

jQueryがどうしても必要なシーンというのは少なくなってきています。
フロントエンドの流行としては、
直接DOMを操作するのは汚いこととなってきて、
Virtual DOMを操作するのが流行っています。
Reactとかそうですね。

http://facebook.github.io/react/

そうすると、もうjQueryの出番なんてAjaxぐらいしかありません。
しかし、AjaxのためだけにjQueryを読み込むのは大袈裟すぎますよね。
というわけで、シンプルなAjaxライブラリはないかと調べて見つけたのがSuperAgentです。

https://github.com/visionmedia/superagent

こちら、Node.jsでも使えます。
npmでインストールして、読み込みには以前の記事でも紹介したGulpを使います。
var request = require('superagent');

これで使う準備は出来ました。
まずはGETです。
request
  .get('http://hogefoo')
  .end(function(err, res) {
    // なにか処理
  });

メソッドチェーンで処理を繋げていく記述ですね。
次はPOST。
request
  .post('http://hogefoo')
  .send({name: 'Taro', age: 10})
  .type('form')
  .end(function(err, res) {
    // なにか処理
  });

簡単ですね。
なんでもjQueryに頼ることに疑問を抱いてきたら使ってみてはいかがでしょうか。

PAGE TOP