タグ

jQueryに関するtermin2のブックマーク (13)

  • jQueryのDeferredを用いたモダンなAjax処理の書き方

    目次 jQuery 1.4以前の書き方jQuery 1.5以上の書き方jQuery 1.8以上の書き方【発展編1】Deferredを用いた書き方 deferredとは何か?【発展編2】$.when() を用いた書き方参考エントリは軽めのjQuery Advent Calendar 2012の14日目の記事として書きます。軽めといいながら少し重めになってしまった感がありますが、初めてのAdvent Calendar参加ということでご勘弁を。 ※ Twitter API仕様変更によりTwitter APIを使ったコード例は現在動作しなくなっていることにご注意。 jQuery 1.4以前の書き方まずは、少し古めのコード、昔のjQueryのとかでよく見る書き方。 $.ajax({ url: "ajax.html", success: function(data) { alert('succes

    jQueryのDeferredを用いたモダンなAjax処理の書き方
  • jQueryにおけるattrとpropの違いと使いドコロまとめ - Qiita

    checkboxやradioのチェック状態を調べる際にはattrではなくpropを使うのが良い。 attrでも取れないこともないですが、propで取得する方が処理が早いです。 特にIEの場合、inputに対するdisabledの処理がものすごく重く、attrでdisabledやcheckedの処理を沢山していると、無駄に最悪な感じで負荷がかかります。 attrとpropの取得の違い## またこの2つは、同じ値を取得してるようで異なる値を取得するので注意。 例えば の場合、 チェック時 prop true attr checked 非チェック時 prop false attr undefined という全然違う値が返ってきます。 なぜ解釈が違うのか## attrは純粋に 属性における値 を取得するので、この場合は、 checkされてない ↓ checkedという『属性』がない! ↓ unde

    jQueryにおけるattrとpropの違いと使いドコロまとめ - Qiita
  • JQueryのliveイベントがiPhoneのSafariで登録できない

    JQueryのliveで登録したイベントがiPhoneのSafariでは動作しなくて暫くのハマり。 $('#identifier').live("click", function); こんな感じの登録のやつです。 もち、PC上のブラウザでは動く。(多分Androidのブラウザも動いてた気がする) なぜかiScrollに、対象のHTML要素を含んだものを入れるとイベント登録ができたりして、よけいに混乱しておりました。(理由不明) JQueryの該当チケットは多分コレ。 Ticket #5677 LIVE CLICK EVENTS DON'T REGISTER ON MOBILESAFARI (IPHONE) ここのコメントにありますが、回避方法は onclick="" 属性を対象HTML要素に追加 です。 これで無事に動くようになりました。それはそれで びっくりですけども。

  • とりあえず作ってみます JQuery datetimepicker改造版の使い方

    datetimepicker改造版 の使い方です。 ※通常のdatepickerが使える状態(jquery.uiが入っている)の前提で記述しています。 STEP1 まずは、ココからダウンロードしてください。 ダウンロードしたファイルを解凍すると以下の二つのファイルがあります 1. jquery.ui.datetimepicker.js 2. jquery.ui.datetimepicker-jp.js 1が体ファイルで、2が日語化するファイルです。 基的には2を好きなようにいじってください。※詳しい方は1をいじってもらってもかまいませんw 2のファイルはこんな感じです。(ちょっと修正して26行目からの部分をコメントアウトしておく事にしました)

  • jQuery 1.7、1.8 で非推奨になったイベントのメソッドと Ajax 関連のメソッドとイベント - Sarabande.jp

    jQuery: 大半のブラウザにおいて ready は DOMContentLoaded を指すFunction.prototype.apply、bind と $.proxy の比較event.originalEvent、jQuery.event.props.push、jQuery.event.fixHooks について条件分岐からメソッドチェーンやマップによるコールバックにjQuery 1.7、1.8 で非推奨になったイベントのメソッドと Ajax 関連のメソッドとイベントメソッドチェーンもしくはプロパティ表記を使って複数のイベントハンドラを指定するホーバーで削除ボタンの表示をコントロールするmouseenter と mouseover のちがいjQuery のイベントメソッドのなかでの return false と e.preventDefault() のちがい9月1日追記: on メ

  • jQuery.ajax でリクエストをキャッシュさせない方法 - 葉っぱ日記

    jQuery.ajax を使ってGETでリソースにアクセスした場合、IEでは2回目以降のリクエストが実際には発行されずにキャッシュされた結果が使われてしまいます。これを防ぐには $.ajax( { url : "http://example.com/", cache : false, data : { a : "abcd" }, ... } ); のように、cache オプションに false を指定すればいいようにドキュメント(http://docs.jquery.com/Ajax/jQuery.ajax#toptions)に書かれています。実際に cache : false を設定してみると、リクエストの発行される URL は、 http://example.com/?a=abcd&_=1253861397368 のようにクエリの末尾に現在時刻のミリ秒が付加されたものになります。 たい

    jQuery.ajax でリクエストをキャッシュさせない方法 - 葉っぱ日記
  • [jQuery] もう+演算子とはおさらば。jQuery Templates|WEBプログラム覚書

    HOME>WEBプログラム覚書>[jQuery] もう+演算子とはおさらば。jQuery Templates [jQuery] もう+演算子とはおさらば。jQuery Templates いまさらながら、jQueryに公式なテンプレートプラグインあるの気がつきました。 もう一年以上前に出ていたんですね。まだベータだけどw jQuery.tmpl( template [, data] [, options] ) .tmpl()がドキュメント内に記述された文字列をテンプレートとして利用するのに対し、 こちらはJavascriptの変数に入ってる文字列とか、その場でテンプレートを記述したい場合に便利です。 .tmplItem() dataや、レンダリングに利用したデータはDOMツリー追加後に.tmplItem()で取得することができます。 (テンプレート内ではitem、dataが利用できる。)

  • jQueryオブジェクトを入れる変数の名前を$で始める話 - 愛と勇気と缶ビール

    前提として、何度も同じelementを操作するのに毎回 $("#your complicated.selector").css({"...":"..."}); とか書いてる奴はくたばれ。それは、参照するデータが同じなのに毎回DBに問い合わせてるのと同じだぞ。 $で変数名を始めるのはなんでキモいか 僕がjQueryを使うときは$()関数で返ってきたオブジェクトを入れる変数名を$から始める、ということをけっこうよくやるのだけども、それについて「なんかキモくないですか」という意見があったのでちょっと考えてみる。ちなみにそれをやり始めたのはどこかで見たからだと思うんだけど、ソースは忘れた。 jQuery objectをつっこむ変数の名前を$で始めることが気持ち悪い理由はだいたい以下の2つくらいだと思う オブジェクトの型(のようなもの)に基づいてprefixをつけているところに、ハンガリアン的な闇の

    jQueryオブジェクトを入れる変数の名前を$で始める話 - 愛と勇気と缶ビール
  • jQueryの$(this)とthisの違い : ずっと工事中

    jQueryの$(this)とthisの違い jQueryのイベントハンドラやコールバック関数内のthisについてです。 大した内容でもありませんが、なんとなく知らないまま使っている人もいるみたいなので、ちょっとメモ書き。 $(this)とthisの違い thisはDOMエレメントです。 イベントハンドラのthisはそのイベントが発生した要素、eachのコールバック関数内のthisは順番の回ってきた該当する要素です。 一方$(this)の方はと言うと、この要素を$関数に渡して、単にjQueryオブジェクト化しているだけなんですね。 使い分け という事で、使い分けは、 DOMエレメントのプロパティやメソッドを使うときはthis jQueryオブジェクトのメソッドを使いたいときは$(this) ということになります。 例えば a要素のhref属性を取ってきて何か処理を書こうと思ったとき、 何も

  • 【jQuery】長いリストを短くして「もっと見る」をつける at softelメモ

    リストで、あまりに長くなって邪魔な場合があると思います。 例えば、WorPressの年月日のアーカイブの一覧が、3年ぐらいたつと36個もできてしまう。 普段は上10個ぐらいあれば十分。でも件数制限して画面から消してしまうのはなんだかもったいない。 そこで、下図のようなことをしてみます。 スクリプトが動くPCなどの環境ではリストがコンパクトになり、スクリプトが動かない環境では通常通りの表示をします。 JavaScript $(function(){ $("#list").each(function(){ $(this).find("li:gt(10)").each(function(){$(this).hide();}); $(this).append('<p>» もっと見る</p>'); $(this).find("p:last").click(function(){$(this).par

    【jQuery】長いリストを短くして「もっと見る」をつける at softelメモ
  • "smartModalWindow" jQuery plugin - 解説ページ

    Description このスクリプトはjQueryプラグインです。 指定した要素からのリンクされているドキュメントを、モーダルウィンドウ(通称Lightbox)で表示します。ドキュメントの呼び出しにはAjaxを使っています。WebKit搭載ブラウザで実行すると、モーダルウィンドウの開閉時にアニメーションを伴います。 もともとはiPhone/iPod touch/iPadのSafariに最適化したUIを実現するために制作したものなので、少々挙動にクセがあります。PC向けのウェブサイト用途であれば一般的なLightboxクローン(fancyboxなど)をオススメします。 Demos Open Modal Contents!! Usage Step01 head要素内で jquery.smartModalWindow.jsと、jquery.smartModalWindow.cssをそれぞれ読

  • http://www.idocsq.net/page/501

  • 初めてのjQuery:セレクターAPIを一挙解説(前編) (1/6)

    jQueryの具体的な記述方法に入る前に、そもそもJavaScriptでは何ができるかということに少し触れておきましょう。 誤解を恐れずに言えば、JavaScriptは「(X)HTMLCSS(Cascading Style Sheets)を操作するためのプログラミング言語」です。Webサイトを作成するには、通常、(X)HTMLでコンテンツの構造や内容を、CSSで見た目であるレイアウトや装飾を記述します。これに対してJavaScriptは、ユーザーの操作などが発生したタイミングで(X)HTMLCSSを動的に変更することにより、Webサイトにインタラクティブな動きを与えます。 たとえば、第1回で紹介したアコーディオンパネルは、「dt要素がクリックされたらdd要素のheightプロパティを変更する」という処理によって、パネル部分が伸び縮みする動きを実現しています。 jQueryに限らず、Ja

    初めてのjQuery:セレクターAPIを一挙解説(前編) (1/6)
  • 1