jQueryのSelectタグ処理関連
jQueryでSelectタグ系でちょい便利なワザのメモです。
html
<select name="hoge_n" id="hoge_i"> <option value="">---------</option> <option value="1">hoge1</option> <option value="2">hoge2</option> <option value="3">hoge3</option> <option value="4">hoge4</option> </select>
selectで指定のものを選択された状態に
// hoge4を選択状態にしたい場合
$(#pref).val(4);
option要素を追加する
// hogeというIDのSelectにラベル：hoge5、値：5というOptionを追加 $('#hoge_i').append($('<option>').attr({ value: '5' }).text('hoge5'));
selectで選択したものだけ消す
$('#hoge_i option:selected').remove();
もしくは
$('#hoge_i').children(':selected').remove();
でもOK
セレクトボックスのoption要素のテキストを全て表示する
$("#hoge_i option:selected").each(function() { $("#output").html($(this).text() + "<br />"); });
Select系ツール・プラグイン
[http://moto-mono.net/2008/09/14/jqueryselectable.html:title=
selectボックスをシンプルなプルダウンに拡張するjQuery.selectable.js]
selectの複数選択を可能にするmultiple属性をJavaScriptで直感的にする「jQuery crossSelect plugin」
