タグ

ブックマーク / ginpen.com (7)

  • jQueryでフォームをAjax送信する際の基本パターンのチュートリアル。二重送信の防御とか。 | Ginpen.com

    仕事の進みがちょいとアレなので、現実逃避もとい気分転換に。 フォームの入力内容を、jQuery.ajax()を使ってサーバーへ送信したいって時のパターンです。 基的な流れ フォームのsubmitを拾う 通常の送信はキャンセル 送信ボタンを無効化 送信先URLやフォームの入力値を取得 送信 受信後、送信ボタンを戻す 入力値をどう得るか、というのがポイントかと思います。 送信ボタンを無効化するってのはやらなくても良いんだけど、誤操作防止のためにも是非やって頂きたいと思います。あと送信ボタンの制御以外にも応用がききます。 デモ なんかお問い合わせフォーム的なものを用意しました。 まー実際にお問い合わせフォームをAjaxで送信する場面なんてないような気もするんですが、基パターンという事で。

    jQueryでフォームをAjax送信する際の基本パターンのチュートリアル。二重送信の防御とか。 | Ginpen.com
  • RSpecでRailsのテストをしてみるテスト。 | Ginpen.com

    めもめも。 この記事はRubyRailsもよくわかっていない人が自分のためのメモとしてだらだら書きました。リファレンスがよくわからなかったので、動かして試してみた感じです。 RSpecは(Railsに限らず)Rubyで動くテストフレームワーク。Railsに最初から入ってるTest::Unitよりも色々と良いらしい……けどそっちも使った事がないので比較はできません。 RubyじゃなくてRailsから利用する視点から俺用にまとめます。 環境 $ ruby -v ruby 1.9.2p290 (2011-07-09 revision 32553) [i686-linux] $ rails -v Rails 3.2.1

    RSpecでRailsのテストをしてみるテスト。 | Ginpen.com
  • jQueryで使えるけどCSSでは使えないセレクター。(CSS おれおれ Advent Calendar 2012 – 13日目) | Ginpen.com

    CSS おれおれ Advent Calendar 2012 – 13日目 今日はちょいと視点を変えて見ました。 jQueryの特徴的な機能として「CSSのセレクターを使って要素を検索できる」というのがあります。 ただしjQueryでは独自に拡張してCSS来のセレクターよりも強力だったりします。逆にjQueryを普段から使っていてたまにCSSを書こうとすると迷う場面もありそうです。 というわけで、jQueryが独自に拡張しているセレクター一覧です。(属性非同値セレクター以外は全部疑似セレクターですね。) 全般 [name!="value"] Attribute Not Equal Selector [name!=”value”] – jQuery API 属性が指定の値でないものを検索します。 .not('[name="value"]')の方が高速です。 意外とこれCSSにないんですよね。

    jQueryで使えるけどCSSでは使えないセレクター。(CSS おれおれ Advent Calendar 2012 – 13日目) | Ginpen.com
  • jQueryの$()が多機能すぎる件について。5種類も仕事があるよ。(軽めのjQuery Advent Calendar 2012 – 01日目) | Ginpen.com

    軽めのjQuery Advent Calendar 2012 – 01日目 jQueryってあるじゃないですか。便利ですよね。いろんなところで紹介されてるっていうかもう普通に使われてると思うんですけど。 jQuery() APIについてはこちら。 jQuery() – jQuery API jQuery(expression, context) – jQuery 日語リファレンス jQuery(html, [ownerDocument]) – jQuery 日語リファレンス jQuery(callback) – jQuery 日語リファレンス jQuery(elements) – jQuery 日語リファレンス jQueryと$は同じものなので、jQuery()と$()は同じです。これ、実は関数なんですよ。 というわけで、以下使い方。 5種類の使い方 セレクター : $('#tar

    jQueryの$()が多機能すぎる件について。5種類も仕事があるよ。(軽めのjQuery Advent Calendar 2012 – 01日目) | Ginpen.com
  • Backbone.jsのサンプルアプリのコードを読んでみた。 | Ginpen.com

    Backbone使ってみるメモ。まだあんまりよくわかってないんだなー。 よくわからないならコードを読めばいいじゃない、という事で、公式で提供されているTodoアプリのコードを読んでみました。 ソース 公式のサンプル。 Backbone.js Todos todos.js いわゆるTodo管理ツールなんだけど、情報をHTML5のLocalStorageに持つようになっている。つまりブラウザを閉じても内容を記憶している。 JSファイル HTMLから読み込んでいるのは以下。 json2.js jquery-1.7.1.js underscore-1.3.1.js backbone.js backbone-localstorage.js todos.js Backbone.jsはUnderscore.jsとjQueryないしZepto.jsが必須。またLocalStorageを使うためのBackb

    Backbone.jsのサンプルアプリのコードを読んでみた。 | Ginpen.com
    mathemathiko
    mathemathiko 2012/11/22
    HTML5のLocalStorageに情報持てるのかすごいな。
  • 必殺の .apply()フックを打つべし! 打つべし!(JavaScript おれおれ Advent Calendar 2011 – 17日目) | Ginpen.com

    JavaScript おれおれ Advent Calendar 2011 – 17日目 .apply()で成り済ましができたり仕事をスルーして丸投げしたりする事ができますが、さらにもうひとつ、フックを行う事ができます。 フック(hook)というのはフック船長のフック、鉤爪の事で、処理を「ひっかける」ような事です。ある関数が実行される際に、独自のコードを実行させる事ができます。 フック (プログラミング) – Wikipedia フック(Hook)は、プログラム中の特定の箇所に、利用者が独自の処理を追加できるようにする仕組みである。また、フックを利用して独自の処理を追加することを「フックする」という。 あの処理がどこで呼ばれてるかわからないときに 具体例をひとつ。例えばjQueryで「どこかのタイミングで勝手にクラス名が追加されてしまって困っている」という場合を考えます。その場合は .add

    必殺の .apply()フックを打つべし! 打つべし!(JavaScript おれおれ Advent Calendar 2011 – 17日目) | Ginpen.com
    mathemathiko
    mathemathiko 2012/11/21
    applyメソッド。
  • CSSは分かるけどjQueryは苦手……という人が .attr()と .prop()に親しんでくれるといいなーと思って書きました。 | Ginpen.com

    もちろん、そうでない方にも親しんで頂きたいと思います。 最近この記事が話題のようです。 CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました この記事中にjQuery 1.6/1.6.1での .attr()仕様変更がらみの話で、うちの「jQuery1.6のattr()で困ったら、1.6.1にすればいいみたい。」の記事へリンクされていました。 ただこの記事はちょっと中身が細かくて、ぱぱっと理解するのは難しいんじゃないかなあと思って、この記事を書いています。どこまでご理解頂けるかはわかりませんが、あっちの記事よりは読みやすいはず。 今さら感もないではないですが……。(´ω`) jQuery 1.6/1.6.1で何があったの? .attr()にまとめていた処理を .attr()と .prop()に分割した そしたら今まで動いていたも

    CSSは分かるけどjQueryは苦手……という人が .attr()と .prop()に親しんでくれるといいなーと思って書きました。 | Ginpen.com
    mathemathiko
    mathemathiko 2012/10/03
    attr()はHTMLの属性を扱う。一方、propはJavaScriptプロパティを扱う。そもそも別物だったのをjQueryでは一緒に扱っていたようで、でも結局1.6.1で元に戻しているみたい。わかりやすい。
  • 1