如何动态更改Dropdown的值并使其不可编辑

Question

我有一个下拉菜单

<select id="BrandNames">
<option value="3000">General</option>
<option value="3001">KFC</option>
<option value="3002">Chutneys</option>
</select>

一旦成功形成下拉列表

我正在尝试通过这种方式更改其值

var setthisvalue = 'KFC' ;

$("#BrandNames").val(setthisvalue);

这是我的 jsfiddle

http://jsfiddle.net/y9cyag0n/1/

这不是设置组合框的值吗？

我的要求是我需要根据 setthisvalue 值设置创建的组合框的值，然后组合框不应该 editable ??

有人可以告诉我为什么它没有设置值吗？？

Answer 1

因为"KFC"不是一个值；对应的值为“3001”。

$("#BrandNames").val('3001').prop('disabled', true);

Answer 2

您试图将值设置为 "KFC"，这不是 option 的值。值为“3001”。

因此，您需要将其设置为适当的值。

另一方面，如果你只有文本字符串，你想根据该字符串设置值，那么你需要在选项中找到该字符串并使用找到的值来设置。

完成后，您可以将 "disabled" 属性设置为 "true"，以禁用 select。

片段:

var value = 'KFC' ;
var $opt = $("#BrandNames").children(":contains(" + value + ")");
$("#BrandNames").val($opt.val());
$("#BrandNames").prop("disabled", true);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="BrandNames">
  <option value="3000">General</option>
  <option value="3001">KFC</option>
  <option value="3002">Chutneys</option>
</select>

注意：这只是一个想法。请注意，如果有多个选项具有相似的文本，那么您需要找到解决方法。另外，请注意 :contains 不是完全匹配，它的字面意思是“包含”，即即使字符串的一部分匹配。理想情况下，您应该对选项进行 filter。

.

Answer 3

$("#BrandNames option:contains('"+ value +"')").prop('selected', true).parent().prop('disabled', true);

参见DEMO

Answer 4

你有文本而不是值，你可以通过文本找到正确的选项，并使用它来设置值，然后禁用下拉列表：

var value = 'KFC' ;

var option = $("#BrandNames option").filter(function(){
   return $(this).text() == value; 
});
$("#BrandNames").val(option.val()).prop('disabled',true);

已更新 fiddle：http://jsfiddle.net/y9cyag0n/3/

如何动态更改Dropdown的值并使其不可编辑

How to change the value of Dropdown dynamically and make it uneditable

jquery