Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

attr使ったら動きが変だった attrじゃないかと思って作ったら、何か変。 attr('checked','')ではなく、removeAttr('checked')を使えばおk どうやらprop使えばいいらしい。 でもpropのが楽に書ける 詳しくはCSSは分かるけどjQueryは苦手……という人が .attr()と .prop()に親しんでくれるといいなーと思って書きました。|Ginpen.comで。 チェックされているかどうかという判定には .prop()を使う必要があります。 HTMLに書いた属性の値を扱いたいときは .attr()を、いかにもJavaScript的な事をする時は .prop() デモ こんな感じで使えばおkだと思う。 <div class="allCheck"> <input type="checkbox" id="allCheck01"><label for="
<ul> <li><label><input type="checkbox" id="all" /> Check all</label></li> <li><label><input type="checkbox" name="check" value="1" /> value 1</label></li> <li><label><input type="checkbox" name="check" value="2" /> value 2</label></li> <li><label><input type="checkbox" name="check" value="3" /> value 3</label></li> <li><label><input type="checkbox" name="check" value="4" /> value 4</label></li> </
目次 jQuery入門 jQueryのインストール・簡単な使い方 クイズゲームの作り方 秘密の暗号を作ってみよう(たぬき暗号) アクションゲームを作ってみよう(ぬりかべ) 画像を使ったジグソーパズルを作ってみよう もぐらたたきっぽいゲーム ドラッグ可能なポップアップウインドウを作ろう jQuery UI Sortableで1ラインオセロゲーム ブラウザ全体をブロックしてみる Geolocation APIを使って都道府県のセレクトボックスを現在地に近い順にソートする 発生したイベントの状態を保持・保存する6つのパターン Ajaxを利用したシンプルなイメージギャラリーを作ってみる テーブルにページ送り(ページング)を実装してみる jQuery UI Draggableを使って付箋(sticky)を作ってみる カラムでソートできるテーブルを自作してみる テーブルを使ったシンプルなドット絵エディ
jQueryのeachメソッドを使用して配列をループする方法をメモします。 前回、Javascriptで配列をループする方法を記載しました。 Javascript:Javascriptで配列をループする「for」 eachメソッドは繰り返し処理を行う時に使用するjQueryの関数です。 配列以外にもオブジェクトも繰り返し処理を行うことが可能です。 下記にjQueryのeachメソッドで配列をループし、配列の値を出力した時の方法をメモします。 ■ jQueryで配列をループ 配列を「$.each」にセットします。 コールバック関数の「function(i, value)」に値が格納されます。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"
今回は超小ネタ。送信が完了したなりなんなりかで画面遷移がスムーズに行われないとユーザが訝しんで送信ボタンを何度もクリックして多重送信になる and 管理者や運営者はそれに苦慮する結果、多重送信されないようにして欲しいというニーズは少なからずあると思います。 が、送信ボタンにid=”submit”が割当てられていたとして、JavaScript(jQuery)で単純に $(function () { $("#submit").click(function () { $(this).attr("disabled", "disabled"); }); }); としてもクリックした直後に送信ボタンがdisabledになって一部ブラウザを除いてformの内容を送信できなくなります(WinXP + IE, firefox, GoogleChrome, Opera, Safariで確認してfirefoxの
AngularJS 1.2 ngモジュール ディレクティブ フィルター サービス 型 グローバルAPI ngMockモジュール サービス グローバルAPI AUTOモジュール サービス ngAnimateモジュール サービス ngCookiesモジュール サービス ngMockE2Eモジュール サービス ngResourceモジュール サービス ngRouteモジュール サービス ディレクティブ ngSanitizeモジュール フィルター サービス ngTouchモジュール ディレクティブ サービス このサイトについて リファレンスの翻訳を中心に、JavaScriptに関する情報を取り扱うサイトです。 現在、公開しているJavaScript関連の情報です。 JavaScript Mozilla Developer Networkの内容を翻訳して公開しています。 jQuery jQuery
複数のファイルをアップロードできる「jQuery Multiple File Upload Plugin」 Check Tweet 配布元:jQuery Multiple File Upload Plugin ライセンス:MIT License and the GPL License. 「jQuery Multiple File Upload Plugin」は一つのinput要素(file)で複数の画像アップロードを可能にするJavaScriptライブラリです。 jQuery Multiple File Upload Pluginの使い方 jQueryのファイルと、配布サイトよりダウンロードしてきたjquery.MultiFile.jsをhead要素などで読み込みます。 <script type="text/javascript" src="jquery.js"></script> <sc
アップロードファイル複数指定できるjavascript「Multiple File Upload plugin for jQuery」 ファイルをアップロードするとき1つずつでは手間がかかります。 また、アップロードしてもらう時には、指定のファイル拡張子以外送ってもらいたくありません。 Multiple File Upload plugin for jQueryは複数かつ拡張子を指定してアップロードさせるjavascriptです。 sponsors 使用方法 Multiple File Upload plugin for jQueryからjquery.MultiFile.jsをjQueryからjquery.jsをダウンロードします。 <script src="http://yourdomian/jquery.js" type="text/javascript"></script> <scr
このコーナーはjQueryやAjax、PHPをフル活用して実際にプロの方々の使用にも耐えうる、 高性能なファイルマネージャー機能をも有するダイアログを作成して行きます。 いつ完成するかはお約束できませんが、定期的に連載したいと思っています。 現在までの完成品サンプルです。 第一回の今回は、エフェクトして表示するモーダルのダイアログを作成します。 今回学習するシステムはすべてルートディレクトリの/filedaialogディレクトリに保存しますので、 新しく作成して置いてください。 サンプルのhtmlは以下のようになります。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="h
Getting started Download a zip of the latest release (or any previous one) from the Github Releases page. Or install using npm: npm install lightbox2 --save Open up the zip file and take a peek at the barebones, working example that is included in the /examples folder. Ready to set Lightbox up on your page? Start by including the Lightbox CSS and Javascript. You can grab both these files from the
AjaxでもURLを更新して履歴を作れるHTML5のpushState試してみた 高速なWebアプリケーションを作成するにはAjaxがなくてはならないものとなりました。AjaxにはURLが更新されず、そのためブラウザの戻るも使用でません。 このような問題を解決するためにHTML5で追加されたのが「pushState」です。 投稿日2011年06月20日 更新日2011年06月20日 pushStateを使用していないサンプル jQueryのloadメソッドを使用したコンテンツ切り替えの簡単なサンプルです。 page1.html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>page1</title> <link rel="stylesheet" href="style.css"> <script
設置方法はとってもシンプル! まず、「dtree.css」と「dtree.js」をhead要素内で読み込みます。 <head> <script type="text/javascript" src="dtree.js"></script> <link rel="stylesheet" type="text/css" href="dtree.css" /> </head> 次に、ツリーを格納するオブジェクトを生成し、add()関数にノードを指定していきます。 このtreeObj部分には、任意のツリーオブジェクト名を指定可能です。 そのため、1ページ内に複数のツリーを埋め込む場合は、このツリーオブジェクト名を別々にすればOKです。 ノードをすべて開く:treeObj.openAll(); ノードをすべて閉じる:treeObj.closeAll(); 任意のノードを開く:treeObj.open
自作のjQueryスクリプトをプラグイン化しよう 自作したjQueryコードは作成した本人なら簡単にパラメーターの調整などを行いカスタマイズできると思いますが、Webに公開して他の人に使用してもらう場合はなかなかむずかしかったりしますよね。 そこでプラグイン化をすることで誰でも簡単に扱えるようにしてみましょう。 投稿日2011年06月13日 更新日2011年06月13日 外部ファイル化 たとえば「#hide-btn」をクリックすると「#view」がフェードアウトして消えるという簡単なスクリプトがあります。 jQuery script $(function() { $('#hide-btn').click(function(){ $('#view').fadeOut(1000); }); }); まずは外部ファイル化しましょう。 jQueryプラグインは「jquery.プラグイン名.js」と
jQuery UI の Draggable プラグインを使った、ドラッグして移動できるボックスにおける、ボックス移動中のスクロール可否設定。ウィンドウや親要素を、スクロールさせたくない場合、scroll オプションに false を指定。ウィンドウや親要素を、スクロールさせたい場合、scroll オプションに true を指定する。 実装例(サンプル) 実装例について 実装例(サンプル)は、containment オプションに、parent を指定し、親要素内だけでしか移動できないようにし、スクロールできない移動ボックスとスクロールできる移動ボックスを並べた。 実装例の動作について 「scroll: false」と書いてあるボックスを、ドラッグして、移動させ、破線で示した親要素の枠に近付けてスクロールしようとしてもスクロールしない。 「scroll: true」と書いてあるボックスを、ドラ
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く