検索ボックスの値をリアルタイムに取得して、部分一致の絞込み検索を実装する
下記のような絞込み検索を jQueryで実装する機会があったのでご紹介します。 検索ボックスに文字を入力するたびにページ内の検索対象から部分一致するワードを絞り込んで検索結果エリアに表示します。 See the Pen …
下記のような絞込み検索を jQueryで実装する機会があったのでご紹介します。 検索ボックスに文字を入力するたびにページ内の検索対象から部分一致するワードを絞り込んで検索結果エリアに表示します。 See the Pen …
前回の記事では、JavaScriptの検証ツール「ESLint」を使用して基本的な検証を始めるまでの手順をまとめました。 下記のコマンドで個別にJSファイルの検証を行うことも可能ですが、手動で検証を行うのは大変です。 e…
表にソート機能を追加するプラグインを紹介します。 「Tablesorter」を利用してソート機能を実装していきます。 デモページ Tablesorterを利用するためにjQuery、を読み込む必要があります。 ※1.x系…
新着ニュースの更新などで良く使う、xmlファイルの読み込みを実装しました。 今回はjQueryでhtmlを追加する書き方をしています。 まず、htmlを用意します。 日付とテキストリンクを更新するシンプルな表示です。 j…
大量の商品データをHTMLに挿入する際、JSONファイルとEJSを使用して楽にHTMLに書き出すことができました! EJSとJSONを使用してよかったこと EJSの見た目がHTMLだからすぐ使えた JSのfor文でHTM…
要素の横並びなど、高さを揃えたいときに使っているjQueryのプラグインをご紹介します。 jquery.heightLine.js jquery.tile.js jQueryAutoHeight.js jquery.he…
以前作ったサイトで、扱っている商品をカテゴリや値段で絞り込みできる検索機能をつけたいという要望がありました。 どうしたもんかと思っていたのですが、Underscore.jsを使って実装してみたら、とても簡単に良い感じにで…
今回ご紹介するのは、Sketch3のCraftというプラグインを使用して、JSONのデータをデザインに反映させるというものです。 ダミーデータではなく、実際に稼働しているAPIのデータを取り込むことで、より公開後のイメー…