动态
添加选项后,我需要禁用选择列表中的某些选项。
我的选择列表是在从另一个列表中选择项目时动态构建的。
该列表是用PHP创建的,然后使用$.ajax
调用返回到我的javascript。将选项添加到我的列表中后,我需要遍历选项并禁用某些选项。
我可以添加选项,但无法禁用特定选项。我认为这是因为选项不受 DOM(或类似的东西)的约束。
这是我现在使用的代码:
// HTML
<select id='selectlist_store' name='selectlist_store' size='6' multiple='multiple'></select>
// Javascript
// Populate store multi-select list
jQuery('#selectlist_city').live('change', function(){
populateStoreListBox(jQuery(this).val(), function(list) {
// Add options to list
jQuery('#selectlist_store').html(list);
// Disable specific element
jQuery('#selectlist_city option [value=56]').attr('disabled','disabled');
});
});
function populateStoreListBox(country_id, callback){
jQuery.ajax({
url: (...),
data: (...),
dataType: 'html',
success: (function(city_list) {
callback(city_list);
})
});
添加某些选项后,我需要做什么才能禁用它们?
一种解决方案可能是返回一个JSON
数组而不是HTML
,然后遍历数组并动态构建我的新选项列表并禁用我想要禁用的选项。
但是还有别的办法吗?
您需要删除 [
jQuery('#selectlist_city option[value=56]').attr('disabled','disabled');
http://jsfiddle.net/pYBqm/