[jQuery]formのselect要素を操作する方法まとめ

<select id="selTest" size="6" multiple>
    <option value="key1">value1</option>
    <option value="key2">value2</option>
    <option value="key3">value3</option>
</select>

curKey = 10;
 
var key  = "key" + curKey;
var text = "value" + curKey;
curKey += 1;
$('#selTest').append( $('<option value="'+key+'">'+text+'</option>') );

var key  = $('#selTest option:selected').val();
$('#selTest option[value='+key+']').remove();

// 指定された要素を選択する
$('#selTest').val('key3');

var offset = 2;
var option = $('#selTest option:eq('+offset+')');
if ( option.val() === undefined ) {
    alert( "3番目の要素は存在しません" );
    return;
}
 
var key = option.val();
alert( "3番目の要素 :" + key );
});

var key  = $('#selTest option:selected').val();
if ( key === undefined ) {
    alert( "要素が選択されていません" );
    return;
}
 
var text = $('#selTest option[value='+key+']').text();
alert( key + "=" + text );

$('#selTest').bind('change', function() {
    alert( "選択状態が変更されました" );
});
 
alert( "選択変更時のハンドラを登録しました。" );

$('#selTest option:selected').each(function() {
    var key  = jQuery(this).val();
    var text = jQuery(this).text();
    alert( key + "=" + text );
});