5509

Site Search

使いやすいセレクトボックスを実装できる jqselectable.js

3年くらい前に最初のバージョンを作ったjQselectableをほぼ全て書き直しました。書きなおす流れで以前のものと互換性がなくなってしまったので、新しいものとして公開します。

でもgithubのリポジトリは同じです。古いものは、古いもので残っているので、もし必要な方がいれば以前の jQselectable(v1.3) を使ってください。

Read more

チェックボックスとかラジオボタンにはlabelを・・・

labelでwrapされてないチェックボックスとかラジオボタンが多い気がするんですけど(たまたまかもしれないけど)、これってそんなに面倒くさいことですかね・・・いやいやこの記事読んでくれてる人にはいないと思うんですけど。

チェックしやすいのはどっち

<input type="checkbox" name="checkbox[]" value="hoge">hoge
<input type="radio" name="radio[]" value="fuga">fuga

これをlabel要素で囲って

<label><input type="checkbox" name="checkbox[]" value="hoge">hoge</label>
<label><input type="radio" name="radio[]" value="fuga">fuga</label>

ってするだけですよね。チェックボックスのラベルっぽいところをクリックして文字選択になったときのあの感じ・・・!

どんなフォームにも使えるjQueryのフォームバリデーション exValidation

jquery.validation.jsというフォームバリデーションプラグインを公開していますが、使える場面が割と限定されてしまうような作りだったので、より幅広く使えるようにexValidationという名前で新しいjQueryプラグインとして作り直しました。伴って仕様や使い方が異なる部分も多いので、ドキュメントとして書いておきます。ただし前半のバリデーションルール周りは同じエンジンを使ってるので、ほぼ同じです。ちなみにすごい長いです。。

ルールを割り当てる際のclass名がhogeからchkhogeに代わりました。アップデートして使う場合は注意してください。

Read more

セレクトボックスに新しいオプションを追加していけるスクリプト

セレクトボックスに新しいオプションを追加していけるスクリプト

セレクトボックスの(value)を選択すると、セレクトボックスが消えて代わりにINPUT要素が選択状態で表示されるので、追加する単語を入力してドキュメント上の適当な箇所をクリックするか、returnキーで決定することで入力項目をセレクトボックスに新しく追加できるスクリプトです。説明がなにやらややこしい感じなので、実際にサンプルを見てもらったほうが早いと思います。

先日のtangoHokanと同じような感じなので、使いどころは微妙ですが。
そもそも、それができる、ということを補足説明などでユーザに伝える必要があると思いますが、ひとつの選択肢としてあればそのうち使う日がくるかもしれません。。

サンプル
サンプルファイルのダウンロード

Read more

書いてるひと

nori
nori
- フロントエンド・エンジニア
Location
- 東京