はてなブックマーク

要素をチェックボックスで絞り込むJSがなかなか見つからなかったので、いっそ自作しました。 チェックボックスを複数選択するとAND条件として絞り込みます。 「絞り込まない」を選択すると未選択の状態に戻ります。 このサンプルHTMLでは、section要素を絞り込んで表示しています。（tr要素などに変更可） 機能 「id=”select”」内のチェックボックスを複数選択するとAND条件として、対応する「id=”result”」内の要素を絞り込みます。 ラジオボタン「絞り込まない」を選択すると未選択の状態に戻ります。 概要 チェックを入れたチェックボックスid名と同名classを持たない要素に「hidden-not-XX」というclassを付与します。 hidden-not-XXがついた要素はCSSで非表示にします。（classの前方参照） 注意 JQueryをあらかじめ読み込んでください。 1