JavaScript プログラマの職種は4種類くらいに分けるべき
jser.md はじめに JavaScript を使っていると「JavaScript出来るの？ jQuery / AngularJS / Node.js etc... で困ってるんだけどさー」みたいな話を振られることがあります。 そういった時に、自分は一般的なライブラリの使い方やフレームワークに対して大した知見も興味もないので、わざわざ説明するのも面倒なのでこうして文章にしておきます。(本当に届いて欲しい人に限って、こういう文章が届かないのはわかっていますが、文章を書くこと自体が気晴らしだと思って諦めます。) 「フロントエンドエンジニア」という言葉の汎用性 先ほどのような話は自分に限ったことではなく、たぶん経験のある人も多いでしょう。 振られた話が自分の分かる範囲、あるいは興味のあるものならばまだ良いのですが、そうでないことがあまりに多すぎます。 話を振られるだけならともかく「JavaSc
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
「Ajax？ 知ってますよ」と言えますか：ITpro
新人配属や異動の季節になった。この4月，あなたがもし新しい職場に配属されて，上司から「君，Ajaxって知ってる？」と聞かれたとする。そのとき，堂々と「知ってますよ」と答えられるだろうか？ このITproのサイトでは，Ajax，マッシュアップ，リッチ・クライアント，SaaSなどいわゆるWeb2.0関連の記事が一昨年ぐらいから毎日のように掲載されている。そもそもITproはこうした言葉を知っている読者を対象にしているので，ほとんどの読者は冒頭のような質問を受けても，「知ってますよ」と堂々と答えられるだろう。しかし，この春初めてITの世界に入る人の中には，「名前や概念的なことなら分かるのですが…」という人も多いのではないだろうか。 そこで今回の記者の眼では，そういう新人君にお勧めな「Ajax学習法」を考えてみた。といっても，要するに，実際に自分でちょっとしたプログラムを作って試してみるだけである
Rails/jQuery UI AutocompleteでDBデータからオートコンプリート
Rails でオートコンプリート機能を実装する機会があり、jQuery UI Autocomplete を使って実現したので備忘録メモ。オートコンプリート機能とは、Google の検索窓でも表示されるような、入力済みの文字列を元に候補のメニューを表示して入力を補完してくれる機能です。Rails 用には jquery-ui-rails という gem があるので、それを利用させて頂きました。 Autocomplete | jQuery UI joliss/jquery-ui-rails Ajax による通信で、サーバーのDBテーブルからオートコンプリートの候補を取得して表示します。 — 環境 — Rails 4.1.6 jquery-ui-rails 5.0.5
rails3-jquery-autocompleteで入力補完機能（オートコンプリート）を実装する - コバログ
rails3-jquery-autocompleteを利用して オートコンプリートで入力補助 DBにはそのオブジェクトのidを保存 を実装しました。 環境 rails3-jquery-autocompleteですが、rails 4.2.3でも動作しました。 インストール 以下をGemfileに追記してbundle install. gem 'rails3-jquery-autocomplete' インストール $ rails generate autocomplete:install application.jsに以下追記する //= require jquery-ui //= require autocomplete-rails 実装 Itemを登録する場面で、カテゴリをオートコンプリートで入力するような場合です。 （すでにCategoryモデルは作成してある前提） routes.rb
Rails 4で作るドラッグアンドドロップで表示順を変更できるサンプルアプリ(スクリーンキャスト付き) - Qiita
はじめに データの並び順を自由自在に入れ替えたい、という要求があったとき、ドラッグアンドドロップで順番が変えられるとなかなか便利です。 そこで本記事ではドラッグアンドドロップによる表示順変更機能をRails 4で実装する手順を説明します。 補足資料 理解しやすくするための補足資料をいろいろ用意してみました。 デモサイト Herokuにデモサイトを作ってみました。 元々のサンプルアプリケーションはCRUDができるようになっていますが、このデモサイトではデータの更新はできません。(変更できるのは順番のみ) ドラッグアンドドロップするとどうなるか、実際に動かしてみてください。 スクリーンキャスト サンプルアプリケーションを作る過程を録画してみました。 フルスクラッチでrails newするところから始めています。 http://www.youtube.com/watch?v=YQ-6HkBhVy
JavaScriptで動的な変数を使う
JavaScriptで「1問5秒以内に答えないといけない1問1答集」を作ります。 残り時間を変数remainTimeに格納するためにDate関数で時間を代入。 remainTime = new Date(); 普通だとこのような感じですね。 でもこれだと全部の設問の残り時間をこれ1つで担当することになるので、1つめのカウントダウンが終わらないうちに次の設問をスタートした場合、1問目のカウントダウン時間が2問目の時間に上書きされてしまいます。 (サンプル) これを避けるために残り時間を格納する変数に各設問番号を割り振ることでそれぞれの残り時間を独立させたいのです。 1問目をスタートしたときの残り時間は remainTime1 = new Date(year,mon,day,hour,min,sec); 2問目の残り時間は remainTime2 = new Date(year,mon,day
)
JavaScript/関数名を文字列で指定して動的に呼び出す機構（evalを使わず) - Yoshino-techyoshino-tech.com
関数名を文字列で指定して呼び出せる機構 † JavaScriptでは、文字列を組み合わせて実行文を作り、evalで実行できますが、 関数を文字列で呼び出すにあたって、evalを使わなくていい方法があります。 関数もオブジェクトとして扱う(変数のように扱える) 連想配列が使える (文字列をキーとする配列が使える) という２つのJavaScriptの特徴を使えば、evalを使わなくても、 動的な文字列による関数呼び出しができます。 関数名を文字列で指定して呼び出すやりかたが使えます。 グローバルスコープの関数に限っては、window["関数名"](引数)で呼び出せます。 ↑
JavaScript初級者から中級者になろう — uhyohyo.net
このページの最終更新日：2019年7月4日 JavaScript。主にWebページを作るのに使われるほか、現在ではさまざまなところで活躍しているプログラミング言語です。 このページはJavaScriptの中級講座です。最新鋭ではないかもしれませんが、読み進めれば大抵のものを自分で作れるようになることでしょう。 言い訳とJavaScriptの歴史 / 問い合わせ 最近の更新2017/10/05 全ページを手直ししました。十六章第六回を追加。2017/11/9 十六章第二十一回・十六章第二十二回を追加。2017/12/2 十七章第三回・十七章第四回を追加。2017/12/3 十七章第五回・十七章第六回・十七章第七回を追加。概要コンテンツは第一篇と第二篇に分かれています。 JavaScriptは昔からWebページに動きを与えるものとして用いられてきましたが、第一篇ではそのような、昔からあるJav
や...やっと理解できた！JavaScriptのプロトタイプチェーン - maeharinの日記
JavaScriptのプロトタイプチェーンについて理解しようとしたのだけど、prototypeとか__proto__とかごちゃごちゃになって、色んなブログを読んでもなかなか理解しきれなくて悶々としていたのだが、図を書いたらパッと理解できた！以下、情報ソースはなるべくECMAScript仕様書（3rd）を元にするようにして書きました なぜ分かりづらいのか？ そもそも、なぜJavaScriptのプロトタイプチェーンは自分にとってこうも分かりづらかったのだろうか？自分なりに分析してみると、まず、「似ているが違う用語が沢山ある」という点がある。ざっとあげただけでも、「prototypeと__proto__」「__proto__と[[Prototype]]」「FunctionとFunctionオブジェクト」などがある。そして次に、「入り組んだ構造が動的に変化する」という点がある。上記のように似たよう
知ってて当然？初級者のためのJavaScriptで使う即時関数(function(){...})()の全て
(function(){...})()は、 (function($){ $.hoge = function() { }; })(jQuery) みたいに使われていたりするコード。GreasemonkeyとかjQueryのプラグインとか、あれこれ見かけることがあると思います。 この話題はいくつかWebでも取り上げられていますが何がどうなってんのかちょっと難しいですね。しかし、誰でも理解できるレベルではあります。というのも、こういう種の難しさは体系的な知識が備わっているか否かということなのです。 でも、この知識を体系化する作業って結構しんどくて、難しくて、まーハゲるほど悩むこともあるかもしれない。それはきっと、とても毛根に悪いかもしれない。スカルプDも真っ青の状況になるかもしれない。それは、悲しいことなのだと思う・・・っ！ 毛根にはこれからもがんばってほしい！いつだって頭を温かいまなざしで見守
JavaScript基礎文法最速マスター - gifnksmの雑多なメモ
続々と増え続ける基礎文法最速マスターシリーズ(あまりにも増えてきたので他の言語記事へのリンクは別の記事に移しました)。 JavaScript 版は誰も書いていなかったようなので書いてみます。こういう解説記事的なものを書くのは初めてなので変なところがあったら指摘して頂けるとありがたいです。 JavaScriptの基礎概念についての解説はこちら：JavaScript基本概念最速マスター - TechTalkManiacs 1/31 23:58追記 コメント欄のos0xさんのご指摘を基に一部追記・修正を行いました。 2/2 2:52追記 switch文・正規表現・例外処理について追加しました。 2/2 6:44追記 コメントでfavrilさんにご指摘頂いた点(typo & コメント・サンプル追加)を修正・加筆しました。 2/2 7:15追記 トラックバックでLiosKさんにご指摘頂いた点(cal
No.1 様々な関数の呼び出し方とarguments
「関数ってなんぞ？」なんて方は、居ないと思いますが･･･ もし居た場合は、「No.3 論理値と関数の基本」の関数部分をもう一度お復習いしておきましょう。 まず、関数は次のような書き方でしたね // 関数宣言をした場合 function say() { alert('Hello!!'); } // 無名関数を変数に入れた場合 var hi = function() { alert('Hi!!'); }; say(); // 結果: "Hello!!" hi(); // 結果: "Hi!!" 関数宣言と変数の中に無名関数を入れるやり方は、一見同じように見えて実は、実行できるタイミングに違いがあるということも学んだと思います。 今回学んでいく「様々な関数の呼び出し方」、表題通り実は関数の呼び出し方にはいろんなやり方があるのです。 呼び出し方その1: ()による呼び出し
【jQuery】チェックボックスを「全て選択」ボタンの設置方法 ｜ KLUTCHE
複数のチェックボックスを一度に全選択・全解除できるボタンを設置する方法です。 チェックボックスのグループが複数ある場合にも対応しています。 デモ デモ Javascript jQuery 依存のスクリプトなので、まず jQuery を読み込んでおきます。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> その下に以下のスクリプトを記載します。 <script type="text/javascript"> $(function(){ $('.checkAll').on('change', function() { $('.' + this.id).prop('checked', this.checked); }); })
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
codebook-10000.com
Hide/show all series in Highcharts?
Adding Charts to Your Site with Highcharts | Envato Tuts+
美人与奸臣(重生)
JavaScriptの「this」は「4種類」？？ - Qiita
新着記事
