javaScript

フロントエンド

【Luminous.js】軽量、jQuery非依存の画像拡大javaScriptプラグイン

サムネイルをクリックすると画像が拡大表示されるjsプラグイン【Luminous.js】の紹介です。画像ポップアップといえば、以下3つが有名なのではないでしょうか。 Lightbox2Fancybox - Fancy jQuery l...
フロントエンド

Create React Appで作成したアプリをgithubで公開する【npm gh-pages】

React.jsを学習してそのアウトプットとして簡単なWEBアプリを作ってサクッと公開したい。まずReactチュートリアルをやってみました。create-react-appというコマンドを利用してとても簡単にローカル環境ができて感動しまし...
フロントエンド

jQuery UIのAutocompleteで入力補完(サジェスト)を実装

入力値にマッチした項目が表示され、入力候補を選択するとテキストフィールドに反映される入力補完(サジェスト)を実装する方法をご紹介します。jsライブラリであるjQuery UIのAutocompleteを利用します。 See t...
フロントエンド

【javaScript】for…in、for…of、forEachの違いと用途

ループの方法が多すぎるし、それぞれちょっとずつ違いがあって全然覚えられないためまとめておきます。 for...in ・列挙可能であればなんでもループできる・順不同であることに注意・オブジェクトのループ専用として利用した方が良い...
フロントエンド

javaScriptのオブジェクト指向(ES6)

ES6のオブジェクト指向の基礎的なところをまとめました。 クラスの定義、インスタンスの生成 Norimonoクラスを定義します。Norimonoクラスは定員を表すcapacityプロパティを持っています。 class N...
フロントエンド

javaScriptのオブジェクト指向(ES6より前の旧構文)

javaScriptのクラスの構文はES6から大きく変わって便利になりました。ES6の構文だけ覚えたいところですが、旧構文から覚えることでjavaScriptならではのプロトタイプベースのオブジェクト指向の理解が深まります。本記事ではES...
フロントエンド

parsley.jsで独自バリデーションを作る

フォームのフロントの入力チェックに欠かせないのがparsley.jsです。ビルドインのバリデーションだけだと基本的なものしかないので、独自バリデーションの作り方を記載しています。 バージョン parsley.js 2.3.13...
フロントエンド

jQueryでinputのvalue属性セレクタが効かない

久しぶりの投稿です。今回はJavaScriptのミニネタ。 明細のある入力フォームを作っていて、明細部分の商品名が重複していたらエラーとなるように、jsでバリデーションをつけたかったのです。目指すのは以下の画像のような感じ。 ...
バックエンド

【Ruby on Rails】javaScriptのclickイベントが発火しないのはturbolinksのせいだった

「商品カートに追加する」ボタンがときどき無反応になる謎現象が起きました。発生条件は、キャッシュをクリアしたあと問題のページに遷移した直後に発生。2回目以降のアクセス時には発生しない。何やらコンソールエラーも出ていました。 Uncau...
フロントエンド

javaScriptでiOS風の電卓を作りました

javaScriptの勉強中です。何か作りながらのほうが楽しいので、電卓を作ってみました。 iOSやmacに標準装備されている電卓風にしてみました。 ただ、この電卓、いくつか動かない機能が……(^^;) +/-や小数点はちょっと面倒...
タイトルとURLをコピーしました