jQuery Select Box Manipulation

Вступление

Манипулирование блоком выбора в jQuery требует дополнительных навыков и взаимодействия, но это не так сложно. Эта статья поможет вам разобраться с полями выбора без каких-либо проблем.

Выберите Создание коробки

Это должно быть просто и очень прямо вперед.

jQuery('#some_element').append(' ');   jQuery('#some_element').append(' '); 

Обновление 01/06/2011 — 3 различных способа выбора опции выбора.

 //select select box option jQuery('#selectboxid option').attr('selected', true); jQuery('#selectboxid option').attr('selected', selected); $("#selectboxid").attr('selectedIndex', indexnumber); 

Выберите опцию Box с помощью jQuery

Вот код для добавления опции в поле выбора. Просто вставьте его и отредактируйте некоторые его части в соответствии с вашими потребностями.

 //obj is the list of option values function(obj) { var create = ' '; for(var i = 0; i '+obj[i]+''; } create += ' '; jQuery('#some_element').append(create); }  //obj is the list of option values function(obj) { var create = ' '; for(var i = 0; i '+obj[i]+''; } create += ' '; jQuery('#some_element').append(create); }  //obj is the list of option values function(obj) { var create = ' '; for(var i = 0; i '+obj[i]+''; } create += ' '; jQuery('#some_element').append(create); } 

Кроме того, вы можете создать параметры в списке элементов и добавить его в чистом jQuery.

 function(id, obj) { jQuery('#some_element').append(' '); jQuery.each(obj, function(val, text) { jQuery('#'+id).append( jQuery('   function(id, obj) { jQuery('#some_element').append(' '); jQuery.each(obj, function(val, text) { jQuery('#'+id).append( jQuery('    «);

 for (var i = 0; i '+ obj [i] +' Получение значения в поле выбора
 Возможно, нам понадобится узнать текущее значение выбранного параметра.

 [JS]

 // # selectbox - идентификатор окна выбора

 jQuery ('опция # selectbox: selected'). val ();
 [code lang = "js"]

 Вы можете получить текст опции, сделав это. 

// # selectbox — идентификатор окна выбора

jQuery («опция # selectbox: selected»). text ();

// # selectbox — идентификатор окна выбора

$ («# SelectList option [value = ‘thisistheone’]»). Text ();

// # selectbox — идентификатор окна выбора

$ («Опция # selectList: first»). Text ()

// # selectbox — идентификатор окна выбора

$ («Опция # selectList: eq (3)»). Text ()

// # selectbox — идентификатор окна выбора

 jQuery('#some_element:selected').each(function(){ alert(jQuery(this).text()); alert(jQuery(this).val()); }); var current = []; jQuery('#some_element:selected').each(function(index, selectedObj){ current[index] = $(selectedObj).text(); }); var foo = jQuery('#multiple :selected').map(function(){return jQuery(this).val();}).get(); 

 jQuery('#selectbox: selected').remove(); Here we will remove all elements except the first and last one. //#selectbox is the id of the select box $("#selectbox option:not(option:first, option:last)").remove(); 

 jQuery('#selectbox option').attr('selected', 'selected'); 

 jQuery('#selectbox option').attr('selected', false); 

 $('#selectbox').change(function(){ var val = $(this).find('option:selected').text(); alert('i selected: ' + val); }); onchange find select box selected items. $('#selectbox').change(function(){ $(this).find('option:selected').each(function () { alert('i selected: ' + $(this).text()); } });