tablesorter.com 2024 著作権. 不許複製 プライバシーポリシー
tablesorter.com 2024 著作権. 不許複製 プライバシーポリシー
仕事の進みがちょいとアレなので、現実逃避もとい気分転換に。 フォームの入力内容を、jQuery.ajax()を使ってサーバーへ送信したいって時のパターンです。 基本的な流れ フォームのsubmitを拾う 通常の送信はキャンセル 送信ボタンを無効化 送信先URLやフォームの入力値を取得 送信 受信後、送信ボタンを戻す 入力値をどう得るか、というのがポイントかと思います。 送信ボタンを無効化するってのはやらなくても良いんだけど、誤操作防止のためにも是非やって頂きたいと思います。あと送信ボタンの制御以外にも応用がききます。 デモ なんかお問い合わせフォーム的なものを用意しました。 まー実際にお問い合わせフォームをAjaxで送信する場面なんてないような気もするんですが、基本パターンという事で。
Awesomplete: Ultra lightweight, highly customizable, simple autocomplete, by Lea Verou 超軽量でカスタマイズ性の高いオートコンプリート実装「Awesomplete」 2KBで次のようにオートコンプリートが実装できます。 実装方法は、補完したいデータを data-list で属性定義するだけ、という簡単さ。 次のように別途datalist タグでデータを定義する事も可能です @を入れた後のドメイン補完機能なんかも応用することで実現が可能 関連エントリ オートコンプリート可能なプルダウン実装「jquery.ajax-combobox」 オートコンプリートにテーブルを使える「Autocomplete-Table」 お手軽に使えるBootstrapベースのオートコンプリート実装jQueryプラグイン「comple
補足事項 引数が1つの場合、targetオブジェクトが省略されたと見なされ、jQuery自体がtargetとなります。 jQueryプラグイン作成時にjQuery名前空間を拡張する際に使用されます。 targetに指定したオブジェクトが変更され、また、そのオブジェクトが戻り値となることに注意してください。 もし、元のオブジェクトを変更したくなければ空のオブジェクトをtargetに指定します。 var object = $.extend({}, object1, object2); $.extend()は通常、再帰的なマージを行いません。 もし、targetに指定したオブジェクトのプロパティがそれ自身もオブジェクトであったり、配列であった場合、 第2引数以降のオブジェクトにキーが一致するプロパティがあれば、完全に上書きされてしまいます。 第1引数のdeepに対して、trueを指定すればこれら
$(document).ready(fn) - bindReady() - $.ready() $(document).ready(fn) が bindReady() を、そしてそこから $.ready() が呼び出される三層構造で、これらのメソッドが機能します。 それぞれの役割は、順に以下のようになります。 $(document).ready(fn)……(1/2) DOM読み込み完了通知イベントの登録( bindReady()メソッドの実行 ) $(document).ready(fn)……(2/2) DOM 読み込み完了時の fn の実行と DOM 読み込み完了時に実行させる関数の登録、 bindReady()……(2) DOM 読み込み完了のチェックと完了時の jQuery.ready()呼び出し jQuery.ready()……(3) DOM 読み込み完了を記録するプロパティの設定
Amazonのメガドロップダウンメニューはこちらの記事で紹介されている通り、 Javascriptを使用することによってスムーズな操作性を実現しています。 今回はこの記事の最後で紹介されている、 Amazonのメガドロップダウンメニューと同様の動きを実現するプラグイン 「jQuery-menu-aim.js」の使い方を解説いたします。 プラグインは、GitHubからzipファイルをダウンロードします。 zipファイルには、プラグイン本体(jquery.menu-aim.js)の他にサンプルファイル(exampleフォルダ)が同梱されています。 以降ではこのサンプルファイルを元に実装方法を解説いたします。 他のプラグインと同様jQuery本体を読み込んだ後に、先ほどダウンロードしたプラグインのjsファイルを読み込みます。 プラグインを実行するための記述は下記の通りです。 $menu.menu
スクロールをトリガーに要素をアニメーションで表示したり、ページを表示した時にちょっとしたエフェクトを加えたり、ボタンのホバー時に気持ちいいアニメーションを加えたり、CSS3のアニメーションを簡単に加えることができるリソースを紹介します。 Story Box Story Box -GitHub スクロールをトリガーに54種類のアニメーションを簡単に実装できるjQueryのプラグイン。アニメーションは非常に軽快で、デモ:ユニークの派手なアニメーションでも快適です。 ScrollMagic ScrollMagic -GitHub Appleのプロダクトページのように次々に要素を表示したり、簡単にパララックスを加えたり、特定の要素をスクロール時にピンで留めて表示したりなど、スクロール系のエフェクトは全部できてしまう感じです。 スマフォなどレスポンシブ対応はもちろん、水平スクロール、無限スクロール、
English version これは何? 選択範囲のテキストを操作するための jQuery プラグインです。 テキスト選択(キャレット)位置や、選択テキストを取得したり、選択されているテキストの置き換えや挿入などを行えます。 使い方 jQuery 本体と、このプラグインを読み込んで使用します。 具体的には下記のように使用します。 API API Documentation デモ 入力フォームの選択テキスト操作 デモ1 テキストボックス(1行テキスト)内で選択されているテキストを取得するデモです。 Demo Javascript HTML Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated
http://qiita.com/advent-calendar/2014/frontrend 概論 ここ近年のモダンJSは特に理由がなければcommon.jsのrequireスタイルで記述され、webpack/browserifyでビルド/読み込むことを前提にしてよい。今やビュー層を除いてブラウザとnodeのライブラリの境界は非常に曖昧である。 識者諸君においては常にどちらの環境でも読み込めるようなライブラリを提供するように心がけることを切に願う。 今日はライブラリの名前しか出さないんで各自ググるように。 立場 サーバサイド~ゲームプログラミング出身node寄りフロントエンドエンジニア このサイトのスタッフだけど他のことに手一杯でQiitaのフロントはまだそんなにいじってない すまんな 他ってなんだろうな 言語 CoffeeScript TypeScript 最近DDDっぽい構成を目指し
It’s hard to believe it’s been nearly eight years since jQuery was released. Web development has changed a lot over the years, and jQuery has changed along with it. Through all of this time, the team has tried to walk the line between maintaining compatibility with code from the past versus supporting the best web development practices of the present. One of those best practices is semantic versio
最近のWebサイトでよく見かける面白い仕掛けのコンテンツやエフェクト、便利な機能を実装できるjQueryのプラグインやスクリプトを紹介します。 Midnight デモページ ロゴやヘッダなどをスクロール時に固定表示し、スクロールして表示されたコンテンツに応じて、固定エレメントのスタイルシートを変更させて表示するjQueryのプラグイン。 デモでは、表示されているコンテンツに応じて、ロゴの背景色とカラーが変わります。 Off Canvas Menu Effects デモページ メニューをサイドやトップ・ボトムから気持ちいいアニメーションで表示させるOff Canvas Menuのかっこいいエフェクトのまとめ。アニメーションのバリエーションとして見るだけでも楽しいです。
photoBy: http://www.jose-aguilar.com/blog/wp-content/uploa…まずは jquery 1.x と 2.x の違い 1.x 系は IE8 以前をサポートするが遅い、重い 2.x 系は IE8 以前のサポートは捨てて、いるが軽い、早い アイルトン・セナじゃあるまいしそんなに早くしてどうすんの?Webページがたった1秒高速化するだけでECサイトなんか、売上が10%向上した事例もあります。 使い分ける対応していないIE8以下には古いjqueryを読み込ませます <!--[if lt IE 9]> <script src="jquery-1.9.1.js"></script> <![endif]--> <!--[if gte IE 9]><!--> <script src="jquery-2.0.0.js"></script> <script s
目次 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
super customized checkboxes and radio buttons for jQuery & Zepto iCheck v1.0.3 @Fronteed Plugin features Identical inputs across different browsers and devices — both desktop and mobile Touch devices support — iOS, Android, BlackBerry, Windows Phone, Amazon Kindle Keyboard accessible inputs — Tab, Spacebar, Arrow up/down and other shortcuts Screenreader accessible inputs — ARIA attributes for Voic
メソッドチェーンの中で、指定した関数をその場で実行せず、遅延して後回しにできる jQuery プラグインです。jQuery の操作を後でまとめて実行したり、一定の間隔でステップ実行できるので、その特性を活かした様々な応用が期待できます。 後回しにする関数は delay メソッドで指定します。このとき、指定した関数はキューに追加するだけで、その関数は実行しません。delay メソッドで繰り返し関数を指定して、後回しにする関数をどんどん追加していきます。 後回しにする関数は $.resume メソッドで実行します。$.resume メソッドの引数には実行間隔が指定でき、その実行間隔の周期で、キューの中の関数を先頭から1つずつ順番に実行します。実行間隔はミリ秒の単位で指定します。省略したときは 10 ミリ秒です。なお、$.resume メソッドを実行し直すと、現在の実行周期を変更できます。 キュ
jQueryのイベントハンドリングには、現在 .on(),.off()のみが推奨されて利用されています。 その基本的な使い方はこんなかんじでした。 $(element).on(event, function() { console.log('event fired!'); }); この場合、対象となる$(element)において指定したeventが発火した時に、コールバック関数が呼び出されます。非常に直感的ですね。 ところで、これは以前の.bind()と全く同じです。 .bind()の場合は、指定したずばりその要素に対してのみ、イベントハンドリングを行います。よって、.bind()が呼び出されたその時点で存在しない要素に対しては、たとえセレクタが一致していたとしてもハンドリングが行われません。 このことを利用すれば、イベントハンドリングをしたいまさにその要素にのみ、たとえその後同じセレクタ
See related links to what you are looking for.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く